<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <title>永嘉前线指挥中心</title>
    <link rel="stylesheet" href="./static/assets/css/iconfont.css">
    <link rel="stylesheet" href="./static\font\iconfont.css">
    <link rel="stylesheet" href="./static/css/common.css">
    <link rel="stylesheet" href="./static/css/style.css" type="text/css">
    <link rel="stylesheet" href="./static/css/loader.min.css" type="text/css">
    <link rel="stylesheet" href="./static/css/index.css">
    <link rel="stylesheet" href="./static/css/Xiang.css">
    <script>
        // var basepath = "[(${baseUrl})]";
        var basepath = "https://yjtf.wztusheng.com:7443/api/";
        //var basepath = "http://192.168.1.168:8081/";
        var impath = "https://yjim.wztusheng.com/";
        //var impath = "http://localhost:8080/";
        var cookie = document.cookie;
        /* if (!cookie) {
            window.location.href = "login.html"
        } */
    </script>
    <script src="./static/assets/js/jquery-3.3.1.min.js"></script>
    <script src="./static/js/common.js"></script>
    <script src="./static/js/imgCommon.js" type="text/javascript"></script>
    <script src="./static/js/forum_viewthread.js" type="text/javascript"></script>
    <script src="./static/js/vue.js"></script>
    <script src="./static/js/xiang.js"></script>
</head>

<body id="investmentRisk">
    <div id="append_parent"></div>
    <div id="ajaxwaitid"></div>
    <script type="text/javascript">
        zoomstatus = parseInt(1);
        var imagemaxwidth = '500';

        var aimgcount = new Array();
    </script>
    <div id="container">
        <header class="header-bg">
            <div class="tap">
                <div class="tap-item tap-item-active hidden"></div>
                <div class="tap-item hidden"></div>
                <!--            <div class="tap-item" onclick="toRepair()">抢修进度情况</div>-->
            </div>
            <div class="clock">2020-00-00 00:00:00</div>
            <div class="blackClass">
                <div class="left"></div>
                <div class="right"></div>
            </div>
        </header>
        <main>
            <div class="myTip"></div>
            <ul class="realTime-list">
                <!-- <li class="realTime-item" onclick="toMeteorological()">微气象观测点</li> -->
                <li class="realTime-item" onclick="toPlatform()">台区布局图</li>
                <!--            <li class="realTime-item" onclick="toHeat()">变电站内涝</li>-->
                <li class="realTime-item" onclick="toPower()">
                    用户失电情况
                    <!--                <div>-->
                    <!--                    <div class="realTime-item-btn1 active" onclick="toCity()">县</div>-->
                    <!--                    <div class="realTime-item-btn2" onclick="toTownship()">镇</div>-->
                    <!--                </div>-->
                </li>
                <li class="realTime-item">支援情况</li>
                <li class="realTime-item">水文情况</li>
                <li class="realTime-item">统计信息</li>
                <li class="realTime-item">村镇失电情况</li>
                <!--                        <li class="realTime-item" onclick="toFight()">作战地图</li>-->
                <!--                        <li class="realTime-item" onclick="toLine()">主网线路图</li>-->
            </ul>
            <div class="sideTab"></div>
            <div class="sideTab"></div>
            <div class="countiesBox hidden sideTab">
                <div class="clearfix countiesTabListBox">
                    <div class="right clearfix countiesTabList">
                        <div class="left countiesTabListAciton" @click="Counties(0)">供电所</div>
                        <div class="right" @click="Counties(1)">县局</div>
                    </div>
                </div>
                <div class="qsqs">
                    <div class="center countiesTabCon">
                        <div class="clearfix">
                            <div class="col25 left" v-for="(item,index) in navList">{{item.title}}</div>
                        </div>
                        <div class="">
                            <div class="clearfix center " v-for="(item,index) in list">
                                <div class="col25 left">{{item.supportName ? item.supportName:"暂无数据"}}</div>
                                <div class="col25 left">{{item.supportNum ? item.supportNum:"暂无数据"}}</div>
                                <div class="col25 left">{{item.supportedName ? item.supportedName:"暂无数据"}}</div>
                                <div class="col25 left">{{item.carNum ? item.carNum:"暂无数据"}}</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>


            <!--        <div class="repair-chart">-->
            <!--            <div style="padding: 2rem 1rem 1rem;">-->
            <!--                <div class="repair-chart-title">实时库容</div>-->
            <!--                <div class="chart" id="chart3"></div>-->
            <!--            </div>-->
            <!--        </div>-->

            <div class="active-exp">
                <div class="active-exp-title">
                    <i class=""></i>
                    <span>全选</span>
                </div>
                <div class="active-exp-item">
                    <ul>
                        <li onclick="select(0,0)"><i class="onIcon"></i>
                            <div class="blue"></div><span>35kV线路</span>
                        </li>
                        <li onclick="select(0,1)"><i class="onIcon"></i>
                            <div class="yellow"></div><span>110kV线路</span>
                        </li>
                        <li onclick="select(0,2)"><i class="onIcon"></i>
                            <div class="red"></div><span>220kV线路</span>
                        </li>
                    </ul>
                    <ul>
                        <li onclick="select(1,0)"><i class="onIcon"></i><span
                                class="icon iconfont icon_blue">&#xe60a;</span><span>35kV变电站</span></li>
                        <li onclick="select(1,1)"><i class="onIcon"></i><span
                                class="icon iconfont icon_yellow">&#xe60a;</span><span>110kV变电站</span></li>
                        <li onclick="select(1,2)"><i class="onIcon"></i><span
                                class="icon iconfont icon_red">&#xe60a;</span><span>220kV变电站</span></li>
                    </ul>
                </div>
                <div class="active-exp-item">
                    <ul>
                        <li onclick="select(2,0)"><i class="onIcon"></i><span
                                class="icon iconfont icon_blue">&#xe602;</span><span>北斗基站</span></li>
                        <li onclick="select(2,1)"><i class="onIcon"></i><span
                                class="icon iconfont icon_yellow">&#xe60c;</span><span>抢修任务</span></li>
                    </ul>
                    <ul>
                        <li onclick="select(3,0)"><i class="onIcon"></i><span
                                class="icon iconfont icon_blue">&#xe60d;</span><span>重要用户</span></li>
                        <li onclick="select(3,1)"><i class=""></i><span
                                class="icon iconfont icon_yellow">&#xe601;</span><span>地质灾害</span></li>
                    </ul>
                </div>
                <div class="active-exp-item">
                    <ul>
                        <li onclick="select(4,0)"><i class="onIcon"></i><span
                                class="icon iconfont icon_blue">&#xe810;</span><span>重要信息</span></li>
                    </ul>
                    <ul>
                        <li onclick="select(5,0)"><i class=""></i><span
                                class="icon iconfont icon_blue">&#xe60d;</span><span>抢修人数</span></li>
                    </ul>
                </div>
            </div>
            <!-- 失电历史情况 -->
            <div class="powerLossHistory center hidden">
                <div>历史失电信息</div>
                <div class="powerLossHistoryFor"></div>
            </div>
            <!-- /失电历史情况 -->
            <div class="fight">

                <div class="fight-btn"></div>
                <div class="fight-btn3">
                    <div class="fight-btn3-item active"><img src="./static/img/icon_fightPop1.png">抢修明细</div>
                    <!--                <div class="fight-btn3-item"><img src="./static/img/icon_fightPop4.png">调度通知</div>-->
                    <!--                <div class="fight-btn3-item"><img src="./static/img/icon_fightPop6.png">物资统计</div>-->
                </div>

                <div class="dpvue">
                    <div class="search">
                        <div class="colorfff warningLevel">
                            市防指响应等级:{{warningLevel?warningLevel.commandResponseLevel:'0'}}级
                        </div>
                        <div class="carousel ">
                            <el-carousel height="43px" direction="vertical" :autoplay="true" class="col90 auto "
                                indicator-position="none">
                                <el-carousel-item v-for="(item,index) in textEventList">
                                    <div class="colorfff text2Row">{{index + 1}}.{{item.time.slice(0,11)}}
                                        {{item.content}}
                                    </div>
                                </el-carousel-item>
                            </el-carousel>
                        </div>

                        <div class="searchbox">
                            <div class="searchTop clearfix relative">
                                <div class="left absolute">
                                    <span class="iconfont iconicon_search ft16"></span>
                                </div>
                                <input type="text" class="left col100 qhinput" placeholder="请输入搜索内容"
                                    @input="SearchInput" v-model="searchInput">
                                <span class="iconfont iconswitch ft16 searchSwitch absolute"
                                    @click="SearchSwitch"></span>

                                <input type="text" class="left col100 qhinput" placeholder="百度搜索" id="suggestId">
                                <div id="searchResultPanel"
                                    style="border:1px solid #C0C0C0;width:150px;height:auto; display:none; z-index: 9999;background-color: blue;">
                                </div>
                            </div>
                            <div class="searchCon" v-for="(item,index) in list" @click="SearchClick(index)">
                                <div class="clearfix">
                                    <div class="left">{{item.name}}</div>
                                    <div class="right">{{item.describe}}</div>
                                </div>
                            </div>
                        </div>

                        <div class="fight-btn4  " @click="LW">{{LWstatus.text}}</div>
                        <div class="qsqs hydrologyBox fixed hidden sideTab">
                            <div class="center countiesTabCon color00faec">
                                <div class="clearfix">
                                    <div class="col25 left " v-for="(item,index) in hydrology.navTitle">{{item.title}}
                                    </div>
                                </div>
                                <div class="hydrologyList">
                                    <div class="clearfix center" v-for="(item,index) in hydrology.list">
                                        <div class="col25 left">{{item.name ? item.name:"暂无数据"}}</div>
                                        <div class="col25 left">{{item.volume ? item.volume:"暂无数据"}}</div>
                                        <div class="col25 left">{{item.val ? item.val:"暂无数据"}}</div>
                                        <div class="col25 left">{{item.warn_val ? item.warn_val:"暂无数据"}}</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- 统计信息 -->

                    <div class="statisticsInfoBox sideTab hidden"
                        v-for="(item,index) in statisticsInfo.statisticsInfoList">
                        <div class="borderBot00e7ff clearfix color00faec lheight26">
                            <div class="left  borderRight00e7ff col70 indent5">总队伍数</div>
                            <div class="left col30 center">{{item.totalTeamNum?item.totalTeamNum:0}}</div>
                        </div>
                        <div class="borderBot00e7ff clearfix color00faec lheight26">
                            <div class="left  borderRight00e7ff col70 indent5">总人数</div>
                            <div class="left col30 center">{{item.totalPeopleNum?item.totalPeopleNum:0}}</div>
                        </div>
                        <div class="borderBot00e7ff clearfix color00faec">
                            <div class="left col8 ">
                                <div class="center " style="margin-top: 2rem;">物资信息</div>
                            </div>
                            <div class="left col92 borderLeft00e7ff statisticsInfoFor">
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">安全带</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.safetyBelt?item.materialInfo.safetyBelt:0}}</div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">验电笔</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.electroscope?item.materialInfo.electroscope:0}}</div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">绝源手套</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.insulatingGloves?item.materialInfo.insulatingGloves:0}}
                                    </div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">绝源靴</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.insulatingBoots?item.materialInfo.insulatingBoots:0}}</div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">接地电阻测试仪</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.resistanceTester?item.materialInfo.resistanceTester:0}}
                                    </div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">急救药箱</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.materialInfo.aidKit?item.materialInfo.aidKit:0}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="borderBot00e7ff clearfix color00faec">
                            <div class="left col8 ">
                                <div class="center">物资信息</div>
                            </div>
                            <div class="left col92 borderLeft00e7ff statisticsInfoFor">
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">发电车</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.carInfo.generator?item.carInfo.generator:0}}</div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">作业车</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.carInfo.work?item.carInfo.work:0}}</div>
                                </div>
                                <div class="clearfix borderBot00e7ff lheight26">
                                    <div class="left indent5">发电车</div>
                                    <div class="col33 borderLeft00e7ff right center">
                                        {{item.carInfo.pickup?item.carInfo.pickup:0}}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="sideTab hidden">
                        <!-- 顶村镇失电情况的位置 -->
                    </div>
                    <!-- /统计信息 -->

                    <!-- 左侧Icon列表 -->
                    <div class="absIcon">
                        <span class="iconfont iconalarm absolute alarmIcon" @click="setIconAlarm"></span>
                        <span class="iconfont icontext absolute textIcon" @click="getTaskList"></span>
                    </div>

                    <!-- /左侧Icon列表 -->
                    <!-- 警报icon 重要信息 -->
                    <!-- 1415254329 -->
                    <div class="ImportantInfoListBox absolute" v-if="importantInfo.status">
                        <div class="clearfix">
                            <div class="left col25">重要信息内容</div>
                            <div class="left col35">时间</div>
                            <div class="left col20">等级</div>
                            <div class="left col10">是否显示</div>
                            <div class="left col10">是否滚动</div>
                        </div>
                        <div class="importantInfoCon">
                            <div class="clearfix " v-for="(item,index) in importantInfo.importantInfoList">
                                <div class="left col25">{{item.content?item.content:'未定义'}}</div>
                                <div class="left col35">{{item.time?item.time:'未定义'}}</div>
                                <div class="left col20" v-if="item.color == 0">{{item.color == 0?'低':'未定义'}}</div>
                                <div class="left col20" v-if="item.color == 1">{{item.color == 1?'中':'未定义'}}</div>
                                <div class="left col20" v-if="item.color == 2">{{item.color == 2?'高':'未定义'}}</div>
                                <div class="left col10">
                                    <el-checkbox v-model="item.status"
                                        @change="setImportantInfoCheckbox($event,index,item.id)">
                                    </el-checkbox>
                                </div>
                                <div class="left col10">
                                    <el-checkbox v-model="item.isRoll"
                                        @change="setRoll($event,index,item.id)">
                                    </el-checkbox>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /警报icon 重要信息 -->
                    <!-- 左侧按钮 列表带聊天的 -->

                    <div class="TaskList" v-if="taskInfo.taskStatus">
                        <div class="col90 auto">
                            <div class="clearfix TaskListNavtitle">
                                <div class="left col40 center">任务名称</div>
                                <div class="left col40 center">更新时间</div>
                            </div>
                            <div class="TaskListForBox">
                                <div class="clearfix TaskListFor" v-for="(item,index) in taskInfo.taskList">
                                    <div class="left col40 center">{{item.taskName?item.taskName:'暂无'}}</div>
                                    <div class="left col40 center">{{item.createTime?item.createTime:'暂无'}}</div>
                                    <div class="left col20 center"><span class="iconfont iconwechat TaskListForWechat"
                                            :data-chat="item.yunxin_accid?item.yunxin_accid:15279473859"
                                            :data-name="item.sitePrincipal?item.sitePrincipal:123"
                                            onclick="Chat(event)"></span></div>
                                    <!--  <span class="iconfont iconphone backfff ft16" data-chat=" ' + data.yunxin_accid + '"  data-name="' + data.sitePrincipal + '" onclick="Chat(event)"></span> -->
                                </div>
                            </div>

                        </div>
                    </div>
                    <!-- /左侧按钮 列表带聊天的 -->
                    <!-- 所属供电所 -->
                    <div class="DelongSo">
                        <div class="fight-list">
                            <div class="fight-container ">
                                <div class="fight-table">
                                    <div class="fight-title">
                                        <div class="fight-title-item">所属供电所</div>
                                        <div class="fight-title-item">队伍名称</div>
                                        <div class="fight-title-item">任务名称</div>
                                        <div class="fight-title-item">抢修人数</div>
                                        <div class="fight-title-item">物资需求</div>
                                        <div class="fight-title-item">创建时间</div>
                                        <div class="fight-title-item">抢修进度</div>
                                        <div class="fight-title-item">状态</div>
                                    </div>
                                    <div class="fight-item" v-for="(item,index) in taskInfo.taskList"
                                        @click="getDelongSo(index,$event)">
                                        <div class="fight-title-item">
                                            {{item.belongStation != ""?item.belongStation:"未提供"}}
                                        </div>
                                        <div class="fight-title-item">{{item.teamName != ""?item.teamName:"未提供"}}</div>
                                        <div class="fight-title-item">{{item.taskName != ""?item.taskName:"未提供"}}</div>
                                        <div class="fight-title-item">
                                            {{item.worker_number != ""?item.worker_number:"未提供"}}
                                        </div>
                                        <div class="fight-title-item">{{item.demand != ""?item.demand:"未提供"}}</div>
                                        <div class="fight-title-item">{{item.createTime != ""?item.createTime:"未提供"}}
                                        </div>
                                        <div class="fight-title-item">{{item.progress != ""?item.progress:"未提供"}}%</div>
                                        <div class="fight-title-item">{{item.statusArr != ""?item.statusArr:"未提供"}}
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /所属供电所 -->
                </div>



                <!-- <div class="fight-btn4">路网显示</div> -->

                <!--            <div class="fight-list2">-->
                <!--                <div class="fight_tip_bg">抢修总览</div>-->
                <!--                <div class="list_item">-->
                <!--                    <img src="./static/img/fight_tip2.png" alt="">-->
                <!--                    <p>当前抢修任务：</p>-->
                <!--                    <p>抢修队伍：</p>-->
                <!--                    <p>抢修人数：</p>-->
                <!--                </div>-->
                <!--                <div class="list_item">-->
                <!--                    <img src="./static/img/fight_tip1.png" alt="">-->
                <!--                    <p>当前抢修任务：</p>-->
                <!--                    <p>抢修队伍：</p>-->
                <!--                    <p>抢修人数：</p>-->
                <!--                </div>-->
                <!--                <div class="list_item">-->
                <!--                    <img src="./static/img/fight_tip3.png" alt="">-->
                <!--                    <p>当前抢修任务：</p>-->
                <!--                    <p>抢修队伍：</p>-->
                <!--                    <p>抢修人数：</p>-->
                <!--                </div>-->
                <!--            </div>-->
                <!--            <div class="fight-list3">-->
                <!--                <div class="fight-container">-->
                <!--                    <div class="fight-nav">-->
                <!--                        <div class="fight-nav-item on" onclick="getFightList3(2)">输电</div>-->
                <!--                        <div class="fight-nav-item" onclick="getFightList3(3)">配电</div>-->
                <!--                    </div>-->
                <!--                    <div class="fight-table2">-->
                <!--                        <div class="fight-title">-->
                <!--                            <div class="fight-title-item">序号</div>-->
                <!--                            <div class="fight-title-item">公司名称</div>-->
                <!--                            <div class="fight-title-item">电压</div>-->
                <!--                            <div class="fight-title-item">物资名称</div>-->
                <!--                            <div class="fight-title-item">数量</div>-->
                <!--                        </div>-->
                <!--                        <div class="fight-item">-->
                <!--                        </div>-->
                <!--                    </div>-->
                <!--                </div>-->
                <!--            </div>-->
                <!--            <div class="fight-exp">-->
                <!--                <ul>-->
                <!--                    <li onclick="select(0)"><i class="onIcon"></i><img src="./static/img/icon_fight2.png"><span>变电</span></li>-->
                <!--                    <li onclick="select(1)"><i class="onIcon"></i><img src="./static/img/icon_fight4.png"><span>输电</span></li>-->
                <!--                    <li onclick="select(2)"><i class="onIcon"></i><img src="./static/img/icon_fight6.png"><span>配电</span></li>-->
                <!--                </ul>-->
                <!--            </div>-->
                <div class="fight-detail">

                </div>
                <div class="task-detail">

                </div>

            </div>
            <div class="xvuebox">
                <div class="imbox">
                    <transition name="fade">
                        <div class="clearfix relative imboxclear">
                            <div class="imHide iconfont iconcross" @click="Cross"></div>
                            <div class="left imList" data-icon="1">
                                <li v-for="(item,index) in imList" data-icon="1" @click="ImListClick(index)"
                                    :class="item.youId == classYouId ? 'asd1':'asd2'">{{item.name}}</li>
                            </div>
                            <div class="right "><iframe :src="url"
                                    allow="geolocation; microphone; camera; midi; encrypted-media;"></iframe></div>
                        </div>
                    </transition>
                </div>
                <span class="iconfont iconwechat wechatIcon" data-icon="1" @click="ImIcon"></span>
            </div>
            <div class="power-exp">
                <ul>
                    <li>
                        <p>失电用户(户)</p>
                    </li>
                    <li class="red">
                        <div></div>
                        <p>>100</p>
                    </li>
                    <li class="yellow">
                        <div></div>
                        <p>50-100</p>
                    </li>
                    <li class="blue">
                        <div></div>
                        <p>0-50</p>
                    </li>
                </ul>
            </div>

            <!--        <button class="back" onclick="back()"></button>-->
            <div id="allmap"></div>
            <div id="loader-wrapper">
                <div id="loader"></div>
                <!-- <div class="loader-section section-left"></div> -->
                <!-- <div class="loader-section section-right"></div> -->
                <!-- <div class="load_title">需要几分钟绘制地图行政边界，请耐心等待</div> -->
            </div>
        </main>

        <aside class="aside-left aside-left-bg hide">
            <div class="aside-title">
                <img src="./static/img/title03.png" alt="">
            </div>
            <div id="typhoonInfo" class="aside-context aside-context-bgnone">
                <div class="aside-info">
                    <img src="./static/img/icon04.png" />
                    无台风
                </div>
                <div class="aside-info-list">
                    <div class="aside-info-item">
                        时&nbsp;&nbsp;间 |
                        <span>--月--日--时</span>
                    </div>
                    <div class="aside-info-item">
                        最大风速 |
                        <span> --米/秒</span>
                    </div>
                    <div class="aside-info-item">
                        中心位置 |
                        <span>--E,--N</span>
                    </div>
                    <div class="aside-info-item">
                        移动速度 |
                        <span>--公里/小时</span>
                    </div>
                    <div class="aside-info-item">
                        最大风力 |
                        <span>--级</span>
                    </div>
                    <div class="aside-info-item">
                        移动方向 |
                        <span>--方向</span>
                    </div>
                </div>
                <div class="aside-info-list2">
                    <div class="aside-info-item2">时间</div>
                    <div class="aside-info-item2">风力</div>
                    <div class="aside-info-item2">风速</div>
                    <div class="aside-info-item2">--</div>
                    <div class="aside-info-item2">--</div>
                    <div class="aside-info-item2">--</div>
                </div>
                <!-- <div class="aside-info-list3">
                    <img src="./static/img/icon05.png" />
                    <span>云</span>
                    <div class="aside-info-txt1" onclick="addYun('cloudname')">30分钟</div>
                    <div class="aside-info-txt1" onclick="addYun('cloud1h')">1小时</div>
                    <div class="aside-info-txt1" onclick="addYun('cloud3h')">3小时</div>
                    <div class="aside-info-txt1" onclick="addYun('cloud6h')">6小时</div>
                </div> -->
                <div class="aside-info-list3">
                    <img src="./static/img/icon06.png" />
                    <span>雨</span>
                    <div class="aside-info-txt2">未来</div>
                    <div class="aside-info-txt1" onclick="addYu('24')">24小时</div>
                    <div class="aside-info-txt1" onclick="addYu('48')">48小时</div>
                    <div class="aside-info-txt1" onclick="addYu('72')">72小时</div>
                </div>
            </div>
            <div class="aside-title">
                <img src="./static/img/title10.png" alt="">
            </div>
            <div class="aside-context aside-context-bgnone importantUser color00faec">
                <div class="flex">
                    <div class="col50 center">重要用户总数 |<span class="">{{list.length}}</span> </div>
                    <span class="col50 center">临时保电</span>
                </div>
                <div class="aside-user-list ">
                    <img src="./static/img/line.png" />
                    <div class="flex col100 importantUserList" v-for="(item,index) in list">
                        <div class="col90 flex importantUserLeft space_between" @click="clickList(index)">
                            <div class="col85 importantUserName  ">{{index+1}}.{{item.clientName}}</div>
                            <div
                                :class="['col15','center','flex','aicenter','jccenter',item.circuitStatusStr=='正常'?'green':'red']">
                                {{item.circuitStatusStr}}</div>
                        </div>
                        <div class="col10 center">
                            <el-checkbox v-model="item.isTempCircuit" @change="changecheckbox($event,index,item.id)">
                            </el-checkbox>
                        </div>
                    </div>
                </div>
            </div>
            <div class="aside-title">
                <img src="./static/img/title05.png" alt="">
            </div>
            <div id="carList" class="aside-context aside-context-bgnone">
                <div class="aside-subContext2">
                    <div class="aside-circle2">
                        <img src="./static/img/icon08.png" alt="">
                    </div>
                    <div class="aside-txt">
                        <div class="aside-txt1 clearfix">
                            发电车总数
                            <div class="aside-count">0</div>
                        </div>
                        <div class="aside-txt2">
                            上线数量
                            <div class="aside-count">0</div>
                        </div>
                        <!--                     <div class="aside-txt1 type1">
                        候命数量
                        <div class="aside-count">0</div>
                    </div> -->
                    </div>
                </div>
                <div class="aside-subContext2">
                    <div class="aside-circle2">
                        <img src="./static/img/icon09.png" alt="">
                    </div>
                    <div class="aside-txt">
                        <div class="aside-txt1 clearfix">
                            皮卡总数
                            <div class="aside-count">0</div>
                        </div>
                        <div class="aside-txt2">
                            上线数量
                            <div class="aside-count">0</div>
                        </div>
                        <!--                     <div class="aside-txt1 type1">
                        候命数量
                        <div class="aside-count">0</div>
                    </div> -->
                    </div>
                </div>
                <div class="aside-subContext2">
                    <div class="aside-circle2">
                        <img src="./static/img/icon10.png" alt="">
                    </div>
                    <div class="aside-txt">
                        <div class="aside-txt1 clearfix">
                            作业车数量
                            <div class="aside-count">0</div>
                        </div>
                        <div class="aside-txt2">
                            上线数量
                            <div class="aside-count">0</div>
                        </div>
                        <!--                     <div class="aside-txt1 type1">
                        候命数量
                        <div class="aside-count">0</div>
                    </div> -->
                    </div>
                </div>
            </div>
            <div class="aside-tag tag-left">
                <img src="./static/img/tag.png" />
            </div>
        </aside>

        <aside class="aside-right aside-right-bg hide">
            <!--  <div class="aside-title">
                <img src="./static/img/title24.png" alt="">
            </div> -->
            <!-- <div class="aside-context aside-context-bgnone">
                <div class="aside-tab-list">

                    <div class="select-time">
                        <p>请选择时间</p>
                    </div>
                    <div class="select-time-list">
                        <div class="aside-user-item">2020</div>
                        <div class="aside-user-item">2019</div>
                        <div class="aside-user-item">2018</div>
                        <div class="aside-user-item">2017</div>
                        <div class="aside-user-item">2016</div>
                        <div class="aside-user-item">2015</div>
                        <div class="aside-user-item">2014</div>
                        <div class="aside-user-item">2013</div>
                    </div>
                    <div class="mySelect">
                        <p>请选择</p>
                    </div>
                    <div class="mySelect-list">
                    </div>
                </div>

            </div> -->
            <!-- <div class="aside-tab2">
                <div class="aside-tab2-item active">主网信息</div>
                <div class="aside-tab2-item">配网信息</div>
            </div> -->
            <div id="subContext8">
                <!-- <div class="aside-context">
                    <div class="aside-subTitle">受损情况</div>
                    <div class="aside-subContext" id="subContext81">
                        <div class="aside-circle">
                            <div class="aside-circle-context">
                                <img src="./static/img/icon02.png" />
                                <div class="aside-circle-context-txt">线路</div>
                            </div>
                            <div class="aside-circle-percent clearfix">
                                <div class="aside-circle-left">
                                    <div class="aside-circle-left-deg"></div>
                                </div>
                                <div class="aside-circle-right">
                                    <div class="aside-circle-right-deg"></div>
                                </div>
                            </div>
                        </div>
                        <div class="aside-txt">
                            <div class="aside-txt1 clearfix">
                                线路总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt2">
                                <a href="javascript:;" onclick="popUp('主网受损线路')">受损数量</a>
                                <div class="aside-count">N/A</div>
                                <div class="aside-count-list">
                                    <div class="aside-count-item">倒杆数量 ..... N/A</div>
                                    <div class="aside-count-item">断线数量 ..... N/A</div>
                                </div>
                            </div>
                            <div class="aside-txt1 type1">
                                受损占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-subContext" id="subContext82">
                        <div class="aside-circle">
                            <div class="aside-circle-context">
                                <img src="./static/img/icon03.png" />
                                <div class="aside-circle-context-txt">变电站</div>
                            </div>
                            <div class="aside-circle-percent">
                                <div class="aside-circle-left">
                                    <div class="aside-circle-left-deg"></div>
                                </div>
                                <div class="aside-circle-right">
                                    <div class="aside-circle-right-deg"></div>
                                </div>
                            </div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                变电站总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('主网受损变电')">受损数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                受损占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="aside-context">
                    <div class="aside-subTitle">跳闸情况</div>
                    <div class="aside-subContext" id="subContext83">
                        <div class="aside-circle">
                            <div class="aside-circle-context">
                                <img src="./static/img/icon02.png" />
                                <div class="aside-circle-context-txt">线路</div>
                            </div>
                            <div class="aside-circle-percent clearfix">
                                <div class="aside-circle-left">
                                    <div class="aside-circle-left-deg"></div>
                                </div>
                                <div class="aside-circle-right">
                                    <div class="aside-circle-right-deg"></div>
                                </div>
                            </div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                线路总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('主网跳闸线路')">跳闸数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                跳闸占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-subContext" id="subContext84">
                        <div class="aside-circle">
                            <div class="aside-circle-context">
                                <img src="./static/img/icon03.png" />
                                <div class="aside-circle-context-txt">变电站</div>
                            </div>
                            <div class="aside-circle-percent">
                                <div class="aside-circle-left">
                                    <div class="aside-circle-left-deg"></div>
                                </div>
                                <div class="aside-circle-right">
                                    <div class="aside-circle-right-deg"></div>
                                </div>
                            </div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                变电站总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('主网跳闸变电')">跳闸数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                跳闸占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                </div> -->
                <div class="tab92">


                    <div class="tab92List clearfix col90 auto">
                        <div :class="['left',item.index == tabAction?'color00faec':'colorfff']"
                            v-for="(item,index) in tablist" @click="Tablist(index)">{{item.title}}</div>
                    </div>
                    <div v-if="tabAction == 0">
                        <div class="aside-context" id="subContext2020818">
                            <div class="aside-subTitle"><img src="./static/img/icon01.png" />配网受损情况</div>
                            <div class="aside-subContext">
                                <div class="aside-charts">
                                    <div id="_3dCharts1"></div>
                                </div>
                                <div class="aside-txt aside-txt-type1">
                                    <div class="aside-txt1 clearfix">
                                        线路总数
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 clearfix aside-txtez">
                                        主线
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 clearfix aside-txtez">
                                        支线
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        <a>受损数量</a>
                                        <!--  <a href="javascript:;" onclick="popUp('配网受损线路')">受损数量</a> -->
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        受损占比
                                        <div class="aside-count">0</div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-subContext">
                                <div class="aside-charts">
                                    <div id="_3dCharts2"></div>
                                </div>
                                <div class="aside-txt aside-txt-type1">
                                    <div class="aside-txt1 clearfix">
                                        台区总数
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        <a>受损数量</a>
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        受损占比
                                        <div class="aside-count">0</div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-subContext">
                                <div class="aside-charts">
                                    <div id="_3dCharts3"></div>
                                </div>
                                <div class="aside-txt aside-txt-type1">
                                    <div class="aside-txt1 clearfix">
                                        用户总数
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        <a>受损数量</a>
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        受损占比
                                        <div class="aside-count">0</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="aside-context" id="subContext20208181" style="margin-top: 1rem;">
                            <div class="aside-subTitle"><img src="./static/img/icon01.png" />受损村镇</div>
                            <div class="aside-subContext">
                                <div class="aside-charts">
                                    <div id="_3dCharts4"></div>
                                </div>
                                <div class="aside-txt aside-txt-type1">
                                    <div class="aside-txt1 clearfix">
                                        镇街总数
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        <a>受损数量</a>
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        受损占比
                                        <div class="aside-count">0</div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-subContext">
                                <div class="aside-charts">
                                    <div id="_3dCharts5"></div>
                                </div>
                                <div class="aside-txt aside-txt-type1">
                                    <div class="aside-txt1 clearfix">
                                        行政村总数
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        <a>受损总数</a>
                                        <div class="aside-count">0</div>
                                    </div>
                                    <div class="aside-txt1 type1">
                                        受损占比
                                        <div class="aside-count">0</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div v-else-if="tabAction == 1" style="height: 32.5rem;">
                        <div class="col90 auto colorfff tabAction2">
                            <div class="clearfix">
                                <div class="left col30 center lheight52 tabAction2borderright">供电所</div>
                                <div class="left col35 center tabAction2borderright">
                                    <div class="lheight26 tabAction2borderbot">主线</div>
                                    <div class="clearfix">
                                        <div class="left col50 lheight26 tabAction2borderright">受损数</div>
                                        <div class="left col50 lheight26">未恢复</div>
                                    </div>
                                </div>
                                <div class="left col35 center ">
                                    <div class="lheight26 tabAction2borderbot">用户</div>
                                    <div class="clearfix">
                                        <div class="left col50 lheight26 tabAction2borderright">受损数</div>
                                        <div class="left col50 lheight26">未恢复</div>
                                    </div>
                                </div>
                            </div>
                            <div class="clearfix tabAction2Box center" v-for="(item,index) in list">
                                <div class="col30 left tabAction2borderright">{{item.station}}</div>
                                <div class="left col35 center tabAction2borderright clearfix">
                                    <div class="left col50 lheight26 tabAction2borderright">{{item.mainLineDamagedNum}}
                                    </div>
                                    <div class="left col50 lheight26">{{item.mainLineUnrecoveredNum}}</div>
                                </div>
                                <div class="left col35 center tabAction2borderright clearfix">
                                    <div class="left col50 lheight26 tabAction2borderright">{{item.userDamagedNum}}
                                    </div>
                                    <div class="left col50 lheight26">{{item.userUnrecoveredNum}}</div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>




            </div>

            <div id="subContext9" style="display: none;">
                <!--   <div class="aside-context" id="subContext91">
                    <div class="aside-subTitle"><img src="./static/img/icon01.png" />受损情况</div>
                    <div class="aside-subContext">
                        <div class="aside-charts">
                            <div id="_3dCharts1"></div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                线路总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('配网受损线路')">受损数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                受损占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-subContext">
                        <div class="aside-charts">
                            <div id="_3dCharts2"></div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                倒杆总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('配网受损倒杆')">受损数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                受损占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-subContext">
                        <div class="aside-charts">
                            <div id="_3dCharts3"></div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                配电总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('配网受损配电')">受损数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                受损占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="aside-context" id="subContext92" style="margin-top: 0.4rem;">
                    <div class="aside-subTitle"><img src="./static/img/icon01.png" />跳闸情况</div>
                    <div class="aside-subContext">
                        <div class="aside-charts">
                            <div id="_3dCharts4"></div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                线路总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('配网跳闸线路')">跳闸数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                跳闸占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-subContext">
                        <div class="aside-charts">
                            <div id="_3dCharts5"></div>
                        </div>
                        <div class="aside-txt aside-txt-type1">
                            <div class="aside-txt1 clearfix">
                                台区总数
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                <a href="javascript:;" onclick="popUp('配网跳闸台区'
                                )">跳闸数量</a>
                                <div class="aside-count">N/A</div>
                            </div>
                            <div class="aside-txt1 type1">
                                跳闸占比
                                <div class="aside-count">N/A</div>
                            </div>
                        </div>
                    </div>
                </div> -->
            </div>
            <div class="aside-tag tag-right tag_right">
                <img src="./static/img/tag.png" />
            </div>
        </aside>

        <div class="aside-tag2 tag2-right ">
            <img src="./static/img/tag.png" />
        </div>
        <div class="aside-tag2 tag2-left">
            <img src="./static/img/tag.png" />
        </div>

        <aside class="aside-left aside-left-bg hide">
            <div class="aside-title">
                <img src="./static/img/title01.png" alt="">
            </div>
            <div class="aside-subTitle">变电站</div>
            <div class="aside-context">
                <div class="aside-subContext" id="subContext1">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon03.png" />
                            <div class="aside-circle-context-txt">220kV</div>
                        </div>
                        <div class="aside-circle-percent clearfix">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt">
                        <div class="aside-txt1 clearfix">
                            变电站总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网受损线路')">已恢复</a>
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            未恢复
                            <div class="aside-count">N/A</div>
                        </div>
                    </div>
                </div>
                <div class="aside-subContext" id="subContext2">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon03.png" />
                            <div class="aside-circle-context-txt">110kV</div>
                        </div>
                        <div class="aside-circle-percent">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt aside-txt-type1">
                        <div class="aside-txt1 clearfix">
                            变电站总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网受损变电')">已恢复</a>
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            未恢复
                            <div class="aside-count">N/A</div>
                        </div>
                    </div>
                </div>
                <div class="aside-subContext" id="subContext3">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon03.png" />
                            <div class="aside-circle-context-txt">35kV</div>
                        </div>
                        <div class="aside-circle-percent">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt aside-txt-type1">
                        <div class="aside-txt1 clearfix">
                            变电站总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网受损变电')">已恢复</a>
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            未恢复
                            <div class="aside-count">N/A</div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="aside-subTitle">输电线路</div>
            <div class="aside-context">
                <div class="aside-subContext" id="subContext4">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon02.png" />
                            <div class="aside-circle-context-txt">220kV</div>
                        </div>
                        <div class="aside-circle-percent clearfix">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt aside-txt-type1">
                        <div class="aside-txt1 clearfix">
                            线路总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            已恢复
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网跳闸线路')">未恢复</a>
                            <div class="aside-count">N/A</div>
                            <div class="aside-count-list">
                                <div class="aside-count-item">受损 ........ N/A</div>
                                <div class="aside-count-item">跳闸 ........ N/A</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="aside-subContext" id="subContext5">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon02.png" />
                            <div class="aside-circle-context-txt">110kV</div>
                        </div>
                        <div class="aside-circle-percent">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt aside-txt-type1">
                        <div class="aside-txt1 clearfix">
                            线路总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            已恢复
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网跳闸变电')">未恢复</a>
                            <div class="aside-count">N/A</div>
                            <div class="aside-count-list">
                                <div class="aside-count-item">受损 ........ N/A</div>
                                <div class="aside-count-item">跳闸 ........ N/A</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="aside-subContext" id="subContext6">
                    <div class="aside-circle">
                        <div class="aside-circle-context">
                            <img src="./static/img/icon02.png" />
                            <div class="aside-circle-context-txt">35kV</div>
                        </div>
                        <div class="aside-circle-percent">
                            <div class="aside-circle-left">
                                <div class="aside-circle-left-deg"></div>
                            </div>
                            <div class="aside-circle-right">
                                <div class="aside-circle-right-deg"></div>
                            </div>
                        </div>
                    </div>
                    <div class="aside-txt aside-txt-type1">
                        <div class="aside-txt1 clearfix">
                            线路总数
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            已恢复
                            <div class="aside-count">N/A</div>
                        </div>
                        <div class="aside-txt1 type1">
                            <a href="javascript:;" onclick="popUp('主网跳闸变电')">未恢复</a>
                            <div class="aside-count">N/A</div>
                            <div class="aside-count-list">
                                <div class="aside-count-item">受损 ........ N/A</div>
                                <div class="aside-count-item">跳闸 ........ N/A</div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="aside-tag tag-left">
                <img src="./static/img/tag.png" />
            </div>
        </aside>

        <aside class="aside-right aside-right-bg hide">
            <div class="aside-title">
                <img src="./static/img/title02.png" alt="">
            </div>
            <div id="subContext7">
                <div class="aside-title">
                    <img src="./static/img/title21.png" alt="">
                </div>
                <div class="aside-context aside-context-bgnone">
                    <div class="aside-subContext-wrapper">
                        <div class="aside-subContext-title-list">
                            <div class="aside-subContext-title-item">变电站 | N/A</div>
                            <div class="aside-subContext-title-item">故障数量 | N/A</div>
                            <div class="aside-subContext-title-item">故障占比 | N/A</div>
                        </div>
                        <div class="aside-subContext">
                            <div class="aside-circle">
                                <div class="aside-circle-percent clearfix">
                                    <div class="aside-circle-left">
                                        <div class="aside-circle-left-deg"></div>
                                    </div>
                                    <div class="aside-circle-right">
                                        <div class="aside-circle-right-deg"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-txt aside-txt-type1">
                                <div class="aside-txt1 clearfix">
                                    <a href="javascript:;" onclick="popUp('变电220数量')">故障数量</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电220已恢')">已恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电220未恢')">未恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电110未恢')">恢复占比</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="aside-title">
                    <img src="./static/img/title22.png" alt="">
                </div>
                <div class="aside-context aside-context-bgnone">
                    <div class="aside-subContext-wrapper">
                        <div class="aside-subContext-title-list">
                            <div class="aside-subContext-title-item">变电站 | N/A</div>
                            <div class="aside-subContext-title-item">故障数量 | N/A</div>
                            <div class="aside-subContext-title-item">故障占比 | N/A</div>
                        </div>
                        <div class="aside-subContext">
                            <div class="aside-circle">
                                <div class="aside-circle-percent clearfix">
                                    <div class="aside-circle-left">
                                        <div class="aside-circle-left-deg"></div>
                                    </div>
                                    <div class="aside-circle-right">
                                        <div class="aside-circle-right-deg"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-txt aside-txt-type1">
                                <div class="aside-txt1 clearfix">
                                    <a href="javascript:;" onclick="popUp('变电110数量')">故障数量</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电110已恢')">已恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电110未恢')">未恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电110未恢')">恢复占比</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="aside-title">
                    <img src="./static/img/title23.png" alt="">
                </div>
                <div class="aside-context aside-context-bgnone">
                    <div class="aside-subContext-wrapper">
                        <div class="aside-subContext-title-list">
                            <div class="aside-subContext-title-item">变电站 | N/A</div>
                            <div class="aside-subContext-title-item">故障数量 | N/A</div>
                            <div class="aside-subContext-title-item">故障占比 | N/A</div>
                        </div>
                        <div class="aside-subContext">
                            <div class="aside-circle">
                                <div class="aside-circle-percent clearfix">
                                    <div class="aside-circle-left">
                                        <div class="aside-circle-left-deg"></div>
                                    </div>
                                    <div class="aside-circle-right">
                                        <div class="aside-circle-right-deg"></div>
                                    </div>
                                </div>
                            </div>
                            <div class="aside-txt aside-txt-type1">
                                <div class="aside-txt1 clearfix">
                                    <a href="javascript:;" onclick="popUp('变电35数量')">故障数量</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电35已恢')">已恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电35未恢')">未恢复</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                                <div class="aside-txt1">
                                    <a href="javascript:;" onclick="popUp('变电110未恢')">恢复占比</a>
                                    <div class="aside-count">N/A</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="aside-tag tag-right">
                <img src="./static/img/tag.png" />
            </div>
        </aside>


        <div class="wrong-wrapper">
            <div class="wrong-container">
                <div class="wrong-table">
                    <div class="wrong-title">
                        <div class="wrong-title-item">名称</div>
                        <div class="wrong-title-item">描述</div>
                        <div class="wrong-title-item">单位</div>
                        <div class="wrong-title-item">分类</div>
                        <div class="wrong-title-item">来源</div>
                        <div class="wrong-title-item">时间</div>
                        <div class="wrong-title-item">状态</div>
                    </div>
                    <div class="wrong-item">
                    </div>
                </div>
            </div>
        </div>
        <footer class="footer-bg"></footer>
    </div>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="./static/css/element.css">
    <!-- 引入组件库 -->
    <script src="./static/js/element.js"></script>
    <script src="./static/js/index.js"></script>
    <script src="./static/js/highcharts.js"></script>
    <script src="./static/js/highcharts-3d.js"></script>
    <script src="./static/assets/js/echarts-4.2.0.min.js"></script>

    <!-- 百度地图3.0 离线API Begin -->
    <!-- <script type="text/javascript" src="./web/bmap-offline/map3.0_init.js"></script>-->
    <!-- <script type="text/javascript" src="./web/bmap-offline/map3.0.js"></script>-->
    <!-- 百度地图3.0 End -->
    <script type="text/javascript"
        src="https://api.map.baidu.com/api?v=3.0&ak=pkEy1B1MuG0tCl5ulZx1zu8ZoF9Io7dM"></script>
    <script type="text/javascript" src="./static/js/GeoUtils_min.js"></script>
    <script type="text/javascript" src="./static/js/AreaRestriction_min.js"></script>
    <script type="text/javascript" src="./static/js/drag.js"></script>
    <script type="text/javascript" src="./static/js/city_county.json" async="async"></script>
    <script type="text/javascript" src="./static/js/city_town.json" async="async"></script>
    <script type="text/javascript" reload="1">
        aimgcount[1000] = [];
    // attachimggroup(1000);
    // attachimgshow(1000);
    // var aimgfid = 0;
    </script>
    <script type="text/javascript">
        $(function () {

            getYear();
            //点击切换县乡镇
            // $(".main-aside-btn").click(function(){
            //     $(this).addClass("active");
            //     $(".main-aside-btn2").removeClass("active");
            // })
            // $(".main-aside-btn2").click(function(){
            //     $(this).addClass("active");
            //     $(".main-aside-btn").removeClass("active");
            // })
            // $(".realTime-item-btn2").click(function(){
            //     $(this).addClass("active");
            //     $(".realTime-item-btn1").removeClass("active");
            // })
            // $(".realTime-item-btn1").click(function(){
            //     $(this).addClass("active");
            //     $(".realTime-item-btn2").removeClass("active");
            // })

            $(".realTime-list .realTime-item").click(function () {
                var _index = $(this).index();
                if ($('.sideTab').eq(_index).hasClass("hidden")) {
                    for (let i = 0; i < villageDots.length; i++) {
                        villageDots[i].hide();
                    }
                    $('.sideTab').addClass('hidden');
                    $(".realTime-list .realTime-item").removeClass("active");
                    $('.sideTab').eq(_index).removeClass('hidden');
                    $(this).addClass("active");
                    if (_index == 5) {
                        for (let i = 0; i < villageDots.length; i++) {
                            villageDots[i].show();
                        }
                    }

                } else {
                    $('.sideTab').eq(_index).addClass('hidden');
                    $(this).removeClass("active");
                    for (let i = 0; i < villageDots.length; i++) {
                        villageDots[i].hide();
                    }
                }

                /*  $('.sideTab').hide();
                 $(".realTime-list .realTime-item").removeClass("active"); */

            })
            $(".realTime-item div div").click(function () {
                $(this).parent().find('div').removeClass("active");
                var _index = $(this).index();
                // $(".realTime-item div").find("div").eq(_index).addClass("active");
                $(this).addClass("active");
            })

            //点击切换云
            $("#typhoonInfo .aside-info-list3 .aside-info-txt1").click(function () {
                if (!$(this).hasClass("active")) {
                    $(this).parent().find(".aside-info-txt1").removeClass("active");
                    $(this).addClass("active");
                } else {
                    $(this).removeClass("active");
                }

            })

            //点击收回显示侧边
            $(".aside-right,.aside-left").on("click", ".aside-tag", function () {
                var _index = $(".tap .tap-item:eq(0)").hasClass('tap-item-active') ? 0 : 1;
                if ($(this).hasClass("tag-right")) {
                    $(".aside-right").eq(_index).addClass("hide");
                    $(".fight-btn4").removeClass("toRight");
                    $('.absIcon').removeClass('absIconActive');
                    $('.wechatIcon').removeClass("toRight");
                    $('.search').removeClass("toRight");
                    $(".fight-btn").removeClass("toRight");
                    $(".tag2-right").show();
                } else {
                    $(".aside-left").eq(_index).addClass("hide");
                    $(".realTime-list").removeClass("toLeft");
                    $(".countiesBox").removeClass("toLeft");
                    $('.hydrologyBox').removeClass('toLeft');
                    $(".power-exp").removeClass("toLeft");
                    $(".active-exp").removeClass("toLeft");
                    $(".tag2-left").show();
                }
            })
            $("#container").on("click", ".aside-tag2", function () {
                $(this).hide();
                var _index = $(".tap .tap-item:eq(0)").hasClass('tap-item-active') ? 0 : 1;
                if ($(this).hasClass("tag2-right")) {
                    $(".fight-btn4").addClass("toRight");
                    $('.absIcon').addClass('absIconActive');
                    $('.wechatIcon').addClass("toRight");
                    $('.search').addClass("toRight");
                    $(".fight-btn").addClass("toRight");
                    $(".aside-right").eq(_index).removeClass("hide");
                } else {
                    $(".realTime-list").addClass("toLeft");
                    $(".countiesBox").addClass("toLeft");
                    $('.hydrologyBox').addClass('toLeft')
                    $(".power-exp").addClass("toLeft");
                    $(".active-exp").addClass("toLeft");
                    $(".aside-left").eq(_index).removeClass("hide");
                }

            })

            //点击顶部导航栏

            $(".tap-item").click(function () {
                // $(".realTime-item").removeClass("active");
                if ($(".tap-item").eq(_index).hasClass("tap-item-active")) {
                    return false;
                }
                var _index = $(this).index();
                var _this = $(this);



                C(function () {

                    $(".tap-item").removeClass("tap-item-active");

                    _this.addClass("tap-item-active");

                    if (_index === 0) {
                        setTimeout(function () {
                            $(".realTime-list").eq(0).show();
                            $(".realTime-list").eq(1).hide();
                        }, 500);
                    } else {
                        $(".realTime-item").removeClass("active")
                        $(".realTime-list").eq(0).hide();
                        $(".realTime-list").eq(1).show();
                    }

                    $(".aside-right").addClass("hide");
                    $(".fight-btn4").removeClass("toRight");
                    $('.absIcon').removeClass('absIconActive');
                    $('.wechatIcon').removeClass("toRight");
                    $('.search').removeClass("toRight");
                    $(".fight-btn").removeClass("toRight");
                    $(".tag2-right").show();
                    $(".aside-left").addClass("hide");
                    $(".realTime-list").removeClass("toLeft");
                    $(".power-exp").removeClass("toLeft");
                    $(".active-exp").removeClass("toLeft");
                    $(".tag2-left").show();

                    $("header").removeClass("bg-three");
                    $("footer").removeClass("bg-three");

                    $(".aside-tag2").show();
                });

            });
            function C(callback) {
                C.prototype.init(callback);

            }
            C.prototype = {
                canclick: true,
                init: function (callback) {
                    if (this.canclick) {
                        this.canclick = false;
                        callback();
                        setTimeout(function () {
                            this.canclick = true;
                        }.bind(this), 500);
                    } else {

                        return false;

                    }
                }
            }

            //切换主网 配网
            $(".aside-tab2-item").click(function () {
                $(".aside-tab2-item").removeClass("active");
                $(this).addClass("active");
                var _idx = $(this).index();
                if (_idx === 0) {
                    $("#subContext8").show();
                    $("#subContext9").hide();
                } else if (_idx === 1) {
                    $("#subContext8").hide();
                    $("#subContext9").show();
                } else {
                    $("#subContext8").hide();
                    $("#subContext9").hide();
                }
            })
            $(".fight-list").on("click", ".fight-item", function () {

                $(".fight-item").removeClass("on");
                $(this).addClass("on");
            })
        })
        window.onload = function () {
            $(".back").css("display", "block");
            $('.main-aside-search').hide();
            // getCityBoundary(boundaryType,cityData);
            boundaryType = 'town';
            // getCityBoundary('city', cityData);
            getCityBoundary('town', townshipData);
            // boundaryType='city';
            // for (var i = townships.length - 1; i >= 0; i--) {
            //     townships[i].hide();
            // }
            setTimeout(function () {
                upData();
                mapType == '' ? toActive() : null;
                $(".tap-item").siblings().eq(1).hasClass('tap-item-active') ? $(".myTip").show() : $(".myTip").hide();
            }, 10000)
        }

        // 百度地图API功能
        var map = new BMap.Map("allmap", { mapType: BMAP_SATELLITE_MAP, minZoom: 7, maxZoom: 19, enableMapClick: false });    // 创建Map实例
        var wz = new BMap.Point(120.68259126286105, 28.307380864620693);
        map.centerAndZoom(wz, 11);               // 初始化地图,设置中心点坐标和地图级别
        // map.setCurrentCity("温州");           // 设置地图显示的城市 此项是必须设置的
        map.enableScrollWheelZoom(true);        //开启鼠标滚轮缩放
        map.enableContinuousZoom(true);    	    //启用地图惯性拖拽，默认禁用





        //设置地图显示范围
        // map.enableScrollWheelZoom();
        // var b = new BMap.Bounds(new BMap.Point(74.504664,2.156547),new BMap.Point(150.865852,56.706714));
        // try {
        //     BMapLib.AreaRestriction.setBounds(map, b);
        // } catch (e) {
        //     alert(e);
        // }

        //初始化渲染
        taskPoint();                //抢修驻点
        toDisaster();               //地质灾害
        toHeat();                   //变电
        getGanData();               //倒杆
        toRepair();                 //北斗
        getImportantUserList();     //获取重要用户列表
        getTyphoonInfo();           //获取台风数据
        getCarList();               //获取汽车数据
        getDamagedMainNew();        //获取主网受损1
        getDamagedBranchNew();      //获取配网受损1
        getTripMainNew();           //获取主网受损2
        getTripBranchNew();         //获取配网受损2
        getVillageDots();           //获取村镇失电点
        var villageDotsStatus = false //村镇失电是否显示 
        //自定义变量
        var typhoonId;
        var boundaryType = 'city';	//行政边界类型= 区县市:city; 乡镇街道:town;
        var mapType = '';			//地图类型= 历史台风:typhoon; 当前台风:active; 失电:power; 北斗:repair; 作战地图:fight; 台区布局:platform; 地质灾害: disaster;重要信息importantText
        var citys = [];             //区县边界
        var citys2 = [];			//乡镇的区县边界
        var cityLabel = [];           //乡镇名
        var townships = [];			//乡镇边界
        var typhoonDots = [];			//台风坐标点
        var typhoonLines = [];		//台风折线
        var carMk = [];               //台风图标
        var lastCarMk = [];			//台风图标最后一个
        var lastDot = 0;              //当前台风风力
        var heatDots = [];			//变电站内涝坐标点
        var taiQuBg = [];				//河流前景图
        var powerDots = [];			//失电用户坐标点重要用户坐标点
        var repairDots = []; 			//抢修情况坐标点
        var disasterDots = [];        //地质灾害坐标点
        var importantTextDots = [];        //重要信息坐标点
        var repairTaskDots = [];        //抢修任务坐标点
        var lineDots = []; 			//主网线路坐标点
        var groundOverlays = [];      //云层图片
        var yunType = '';             //云层类型
        var yus = [];                 //雨层坐标
        var yuType = '';              //雨层类型 24,48,72
        // var blackOverlay=[];        //黑色遮罩蒙版
        var popType = [];             //弹窗类型
        var searchDot = [];           //搜索结果点    0
        var isRun = true;             //台风运动状态= 正在运动:true; 运动结束:false;
        var pageCurrent = 1;          //列表分页
        var angle = 0;                //台风角度
        var ganLines = [];            //倒杆线路
        var ganLabel = [];            //倒杆文字
        var fightDots = [];           //作战坐标点
        var fightList = [];           //作战地图抢修列表
        var taskDots = [];            //任务坐标点
        var fightDotsOpen = false;    //层级开关
        var powerInfo = {};
        var asdasd;                     //抢修人数标注
        var asdasdbox = [];                     //抢修人数标注
        var villageDots = [];           //村镇失电点

        //监控地图级别
        map.addEventListener("zoomend", function () {

            if (lastCarMk.length != 0 && isRun == false) {
                for (var i = lastCarMk.length - 1; i >= 0; i--) {
                    var point = lastCarMk[i].point;
                    map.removeOverlay(lastCarMk[i]);
                    var zoom = map.getZoom() - 7 < 0 ? 0.5 : Math.pow(2, map.getZoom() - 8 - 1);
                    var size = zoom * lastDot * 68;
                    var TFIcon = new BMap.Icon("./static/img/taifeng.png", new BMap.Size(size, size), {    //小车图片
                        imageOffset: new BMap.Size(0, 0)                    //图片的偏移量。为了是图片底部中心对准坐标点。
                    });
                    TFIcon.setImageSize(new BMap.Size(size, size));
                    lastCarMk[i] = new BMap.Marker(point, { icon: TFIcon });  // 创建标注
                    lastCarMk[i].setRotation(angle);
                    var lastTF = lastCarMk[i];
                    var s = angle;
                    var interval = setInterval(function () {
                        if (mapType != "active") {
                            clearInterval(interval);
                        } else {
                            lastTF.setRotation(s);
                            s++;
                            s = angle;
                        }
                    }, 100);
                    map.addOverlay(lastCarMk[i]);
                }
                // for (var i=0;i<heatDots.length;i++){
                //     myIcon.setImageSize( new BMap.Size(24,24));
                // }
            }
            var size = map.getZoom();
            $('.iconfont').css('font-size', size + 'px');
            $('.miniLab').css('font-size', size + 'px');
            if (map.getZoom() >= 12 && !fightDotsOpen) {

                for (var i = 0; i < lineDots.length; i++) {
                    lineDots[i].show();
                }
                // for (var i=0;i<ganLabel.length;i++){
                //     ganLabel[i].show();
                // }
                for (var i = 0; i < cityLabel.length; i++) {
                    cityLabel[i].show();
                }
                for (var i = disasterDots.length - 1; i >= 0; i--) {
                    disasterDots[i].setContent(disasterDots[i].maxContent);
                    disasterDots[i].setOffset(new BMap.Size(-6, -6));
                }
                fightDotsOpen = true;
                for (var i = importantTextDots.length - 1; i >= 0; i--) {
                    importantTextDots[i].setContent(importantTextDots[i].maxContent);
                    importantTextDots[i].setOffset(new BMap.Size(-6, -6));
                }
                for (var i = repairTaskDots.length - 1; i >= 0; i--) {
                    repairTaskDots[i].setContent(repairTaskDots[i].maxContent);
                    repairTaskDots[i].setOffset(new BMap.Size(-6, -6));
                }

            } else if (map.getZoom() < 12 && fightDotsOpen) {

                for (var i = 0; i < lineDots.length; i++) {
                    lineDots[i].hide();
                }
                // for (var i=0;i<ganLabel.length;i++){
                //     ganLabel[i].hide();
                // }
                for (var i = 0; i < cityLabel.length; i++) {
                    cityLabel[i].hide();
                }
                for (var i = disasterDots.length - 1; i >= 0; i--) {
                    disasterDots[i].setContent(disasterDots[i].minContent);
                    disasterDots[i].setOffset(new BMap.Size(-1.5, -1.5));
                }
                for (var i = importantTextDots.length - 1; i >= 0; i--) {
                    importantTextDots[i].setContent(importantTextDots[i].minContent);
                    importantTextDots[i].setOffset(new BMap.Size(-1.5, -1.5));
                }
                fightDotsOpen = false;
            }
            // if (map.getZoom()>=13&&mapType=='platform'&&taiQuBg.getImageURL()=='./static/img/TaiQu.png') {
            //     taiQuBg.setImageURL('./static/img/TaiQu.svg');
            //     map.addOverlay(taiQuBg);
            // }else if(map.getZoom()<13&&mapType=='platform'&&taiQuBg.getImageURL()=='./static/img/TaiQu.svg'){
            //     taiQuBg.setImageURL('./static/img/TaiQu.png');
            //     map.addOverlay(taiQuBg);
            // }
        });

        //黑色遮罩---------开始---------
        var blist = [];
        var districtLoading = 0;

        function getBoundary() {
            addDistrict("永嘉县");
        }

        /**
         * 添加行政区划
         * @param {} districtName 行政区划名
         * @returns  无返回值
         */
        function addDistrict(districtName) {
            //使用计数器来控制加载过程
            districtLoading++;
            var bdary = new BMap.Boundary();
            bdary.get(districtName, function (rs) {       //获取行政区域
                var count = rs.boundaries.length; //行政区域的点有多少个
                if (count === 0) {
                    alert('未能获取当前输入行政区域');
                    return;
                }
                for (var i = 0; i < count; i++) {
                    blist.push({ points: rs.boundaries[i], name: districtName });
                };
                //加载完成区域点后计数器-1
                districtLoading--;
                if (districtLoading == 0) {
                    //全加载完成后画端点
                    drawBoundary();
                }
            });
        }

        function drawBoundary() {
            //包含所有区域的点数组
            var pointArray = [];

            /*画遮蔽层的相关方法
                *思路: 首先在中国地图最外画一圈，圈住理论上所有的中国领土，然后再将每个闭合区域合并进来，并全部连到西北角。
                *      这样就做出了一个经过多次西北角的闭合多边形*/
            //定义中国东南西北端点，作为第一层
            var pNW = { lat: 59.0, lng: 73.0 }
            var pNE = { lat: 59.0, lng: 136.0 }
            var pSE = { lat: 3.0, lng: 136.0 }
            var pSW = { lat: 3.0, lng: 73.0 }
            //向数组中添加一次闭合多边形，并将西北角再加一次作为之后画闭合区域的起点
            var pArray = [];
            pArray.push(pNW);
            pArray.push(pSW);
            pArray.push(pSE);
            pArray.push(pNE);
            pArray.push(pNW);
            //循环添加各闭合区域
            for (var i = 0; i < blist.length; i++) {
                //添加显示用标签层
                var label = new BMap.Label(blist[i].name, { offset: new BMap.Size(20, -10) });
                label.hide();
                map.addOverlay(label);

                //添加多边形层并显示
                var ply = new BMap.Polygon(blist[i].points, { strokeWeight: 5, strokeColor: "#03f5ff", fillOpacity: 0.01, fillColor: " #FFFFFF" }); //建立多边形覆盖物
                ply.name = blist[i].name;
                ply.label = label;
                map.addOverlay(ply);

                //添加名称标签层
                // var centerlabel = new BMap.Label(blist[i].name, { offset: new BMap.Size(0, 0) });
                // centerlabel.setPosition(ply.getBounds().getCenter());
                // map.addOverlay(centerlabel);

                //将点增加到视野范围内
                var path = ply.getPath();
                path.push(path[0]);
                pointArray = pointArray.concat(path);
                //将闭合区域加到遮蔽层上，每次添加完后要再加一次西北角作为下次添加的起点和最后一次的终点
                pArray = pArray.concat(path);
                pArray.push(pArray[0]);
            }

            //限定显示区域，需要引用api库
            var boundply = new BMap.Polygon(pointArray);
            BMapLib.AreaRestriction.setBounds(map, boundply.getBounds());
            map.setViewport(pointArray);    //调整视野

            //添加遮蔽层
            var plyall = new BMap.Polygon(pArray, { strokeOpacity: 0.0000001, strokeColor: "#000000", strokeWeight: 0.00001, fillColor: "rgba(17,17,17,0.68)", fillOpacity: 0.6 }); //建立多边形覆盖物
            map.addOverlay(plyall);
        }

        setTimeout(function () {
            getBoundary();
        }, 100);


        //添加黑色蒙版
        // addBlackOverlay();
        function addBlackOverlay() {
            var SW = new BMap.Point(11.775564, -14.510208);		// 西南角
            var NE = new BMap.Point(163.810825, 64.429627);		// 东北角
            groundOverlayOptions = {
                opacity: 0.8,
                displayOnMinLevel: 6,
                displayOnMaxLevel: 18
            }
            blackOverlay = new BMap.GroundOverlay(new BMap.Bounds(SW, NE), groundOverlayOptions);
            blackOverlay.setImageURL('./static/img/map_bg.jpg');
            map.addOverlay(blackOverlay);
        }
        //黑色遮罩----------结束------------

        //河流蒙版
        function addHeLiu() {
            // 西南角和东北角
            var SW = new BMap.Point(119.57258934968549, 27.088363047794977);
            var NE = new BMap.Point(121.28054133459688, 28.620348692442475);
            groundOverlayOptions = {
                opacity: 1,
                displayOnMinLevel: 6,
                displayOnMaxLevel: 18
            }
            // 初始化GroundOverlay
            var groundOverlay = new BMap.GroundOverlay(new BMap.Bounds(SW, NE), groundOverlayOptions);
            groundOverlay.setImageURL('./static/img/heliu.png');
            map.addOverlay(groundOverlay);
            riverBg = groundOverlay;
        }

        //台区蒙版
        function addTaiQu() {
            // 西南角和东北角 --原png的坐标
            // var SW = new BMap.Point(120.32269414346234, 28.01863816268675);
            // var NE = new BMap.Point(121.00339412647838, 28.61770356298588);

            //西南角和东北角 接近完美
            // var SW = new BMap.Point(120.18489414346234, 28.01863816268675);
            // var NE = new BMap.Point(121.14599412647838, 28.61770356298588);
            //继续测试
            var SW = new BMap.Point(120.18439414346234, 28.02963816268675);
            var NE = new BMap.Point(121.14639412647838, 28.61470356298588);
            //1增大往右？ 1减小往左下
            //2不能随便乱啦
            //3增大右下无疑 但是会把右边拉大
            //4增大往上??
            groundOverlayOptions = {
                opacity: 1,
                displayOnMinLevel: 6,
                displayOnMaxLevel: 18
            }
            // 初始化GroundOverlay
            var groundOverlay = new BMap.GroundOverlay(new BMap.Bounds(SW, NE), groundOverlayOptions);
            groundOverlay.setImageURL('./static/img/TaiQu1.svg');
            map.addOverlay(groundOverlay);
            taiQuBg = groundOverlay;
        }

        //云层蒙版
        groundOverlays = new BMap.GroundOverlay(new BMap.Bounds(new BMap.Point(70.224296, 2.011057), new BMap.Point(146.168338, 43.661077)), {
            opacity: 0.8,
            displayOnMinLevel: 6,
            displayOnMaxLevel: 18
        });

        // groundOverlays.setImageURL('./static/img/yun_30.png');
        map.addOverlay(groundOverlays);

        //雨层蒙版
        // groundOverlays2 = new BMap.GroundOverlay(new BMap.Bounds(new BMap.Point(70.224296,2.011057), new BMap.Point(146.168338,43.661077)), {
        //     opacity: 0.8,
        //     displayOnMinLevel: 6,
        //     displayOnMaxLevel: 18
        // });
        // groundOverlays2.setImageURL('./static/img/yu_24.png');
        // map.addOverlay(groundOverlays2);

        //返回中心点
        // function back(){
        //     map.setZoom(10);
        //     map.panTo(wz);
        // }

        // 行政划分区域
        function getCityBoundary(type, data) {
            for (var i = 0; i < data.length; i++) {
                //三维数组数据渲染
                for (var j = data[i].rings.length - 1; j >= 0; j--) {
                    var ply = new BMap.Polygon(data[i].rings[j], { strokeWeight: 2 }); //建立多边形覆盖物
                    if (boundaryType == "city") {
                        if (type == "city") {
                            var fillColor = "#42d0fe";
                            var fillOpacity = 0.2;
                            var strokeColor = "#03f5ff";
                            citys.push(ply);  //加入多边形数组，以之后获取多边形边界点集
                        }
                    } else {
                        if (type == "city") {
                            var fillColor = "none";
                            var fillOpacity = 0.00002;
                            var strokeColor = "#03f5ff";
                            boundaryType = 'town';
                            citys2.push(ply);  //加入多边形数组，以之后获取多边形边界点集
                        } else {
                            var fillColor = "#42d0fe";
                            var fillOpacity = 0.00002;
                            var strokeColor = "#000000";
                            ply.setStrokeOpacity(0.2);
                            //添加事件
                            addCityClick(ply, new BMap.Point(data[i].lng, data[i].lat));
                            townships.push(ply);
                        }
                    }

                    ply.setFillColor(fillColor);
                    ply.setFillOpacity(fillOpacity);
                    ply.setStrokeColor(strokeColor);
                    map.addOverlay(ply);  //添加覆盖物

                    var point = new BMap.Point(data[i].lng, data[i].lat);
                    var label = new BMap.Label('\<p class="miniLab"\>' + data[i].fNAME + '\</p\>', { position: point, offset: new BMap.Size(-20, 0) });
                    // label.setZIndex(999);

                    label.setStyle({
                        color: "white",
                        fontSize: "12px",
                        border: 'none',
                        backgroundColor: 'translate'
                    });
                    map.addOverlay(label);
                    cityLabel.push(label);
                    label.hide();
                }
            }
        }
        function addCityClick(marker, cityPoint) {
            map.addEventListener('click', function (e) {//鼠标移动监听事件
                if (BMapLib.GeoUtils.isPointInPolygon(e.point, marker)) {
                    map.setZoom(13);
                    map.panTo(cityPoint);
                    for (var i = townships.length - 1; i >= 0; i--) {
                        townships[i].setStrokeColor('#000000');
                        townships[i].setStrokeOpacity(0.2);
                    }
                    marker.setStrokeColor('#03f5ff');
                    marker.setStrokeOpacity(1);

                } else {
                    // townships[i].setStrokeColor('#000000');
                    // townships[i].setStrokeOpacity(0.2);
                }
            });
            // marker.addEventListener("click",function(e){
            //     console.log(e);
            //     for (var i = townships.length - 1; i >= 0; i--) {
            //         townships[i].setStrokeColor('#000000');
            //         townships[i].setStrokeOpacity(0.2);
            //     }
            //     marker.setStrokeColor('#03f5ff');
            //     marker.setStrokeOpacity(1);
            //     map.panTo(cityPoint);
            //     map.setZoom(13);
            // });
            // marker.addEventListener("mouseout",function(e){
            //     marker.setFillOpacity(0.2);
            // });

        }

        //切换县市区
        // function toCity(){
        //     if(boundaryType!='city'){
        //         setTimeout(function(){
        //             $('body').removeClass('loaded');
        //             boundaryType='city';
        //             for (var i = townships.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(townships[i]);
        //                 townships[i].hide();
        //             }
        //             for (var i = citys2.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(citys[i]);
        //                 citys2[i].hide();
        //             }
        //             for (var i = citys.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(citys[i]);
        //                 citys[i].show();
        //             }
        //             if(mapType=="power"){
        //                 for (var i = 0; i < citys.length; i++) {
        //                     var number = 0;
        //                     for (var k = 0; k < powerPoints.length; k++) {
        //                         if(BMapLib.GeoUtils.isPointInPolygon(powerPoints[k].points,citys[i])){
        //                             number++;
        //                         }
        //                     }
        //                     var middle=powerInfo.middle.split('-');
        //                     var base=powerInfo.base.split('-');
        //                     if(number>=powerInfo.advanced){
        //                         var fillColor="#ff0000";
        //                     }else if(number>=middle[0]&&number<middle[1]){
        //                         var fillColor="#ffff00";
        //                     }else if(number<=base[1]){
        //                         var fillColor="#42d0fe";
        //                     }
        //                     citys[i].setFillColor(fillColor);
        //                 }
        //             }
        //             $('body').addClass('loaded');
        //         },100)
        //     }
        // }

        // $('.realTime-item-btn1').click(function(event){
        // 	toCity();
        // 	event.stopPropagation();
        // })
        // $('.realTime-item-btn2').click(function(event){
        // 	toTownship();
        // 	event.stopPropagation();
        // })
        //切换乡镇街道
        // function toTownship(){
        //     if(boundaryType!='town'){
        //         setTimeout(function(){
        //             $('body').removeClass('loaded');
        //             boundaryType='town';
        //             for (var i = townships.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(townships[i]);
        //                 townships[i].show();
        //                 townships[i].show();
        //             }
        //             for (var i = citys2.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(citys[i]);
        //                 citys2[i].show();
        //                 citys2[i].show();
        //             }
        //             for (var i = citys.length - 1; i >= 0; i--) {
        //                 // map.removeOverlay(citys[i]);
        //                 citys[i].hide();
        //             }
        //             if(mapType=="power"){
        //                 for (var i = 0; i < townships.length; i++) {
        //                     var number = 0;
        //                     for (var k = 0; k < powerPoints.length; k++) {
        //                         if(BMapLib.GeoUtils.isPointInPolygon(powerPoints[k].points,townships[i])){
        //                             number++;
        //                         }
        //                     }
        //                     var middle=powerInfo.middle.split('-');
        //                     var base=powerInfo.base.split('-');
        //                     if(number>=powerInfo.advanced){
        //                         var fillColor="#ff0000";
        //                     }else if(number>=middle[0]&&number<middle[1]){
        //                         var fillColor="#ffff00";
        //                     }else if(number<=base[1]){
        //                         var fillColor="#42d0fe";
        //                     }
        //                     townships[i].setFillColor(fillColor);
        //                 }
        //             }
        //             $('body').addClass('loaded');
        //         },100)
        //     }
        //
        // }

        //清除覆盖物
        function close() {
            $(".wrong-wrapper").hide();
            if (mapType == "typhoon" || mapType == "active") {
                for (var i = typhoonDots.length - 1; i >= 0; i--) {
                    if (mapType == "typhoon" && typhoonDots[i].mapType == "typhoon") {
                        map.removeOverlay(typhoonDots[i]);
                    }
                }
                typhoonDots = [];
                for (var i = typhoonLines.length - 1; i >= 0; i--) {
                    if (mapType == "typhoon" && typhoonLines[i].mapType == "typhoon") {
                        map.removeOverlay(typhoonLines[i]);
                    }
                }
                typhoonLines = [];
                for (var i = lastCarMk.length - 1; i >= 0; i--) {
                    if (mapType == "typhoon" && lastCarMk[i].mapType == "typhoon") {
                        map.removeOverlay(lastCarMk[i]);
                    }
                }
                lastCarMk = [];
                for (var i = yus.length - 1; i >= 0; i--) {
                    map.removeOverlay(yus[i]);
                }
                yus = [];
                map.removeOverlay(carMk);
                carMk = [];
                mapType == "active" ? $(".myTip").hide() : null;
                $(".aside-info-txt1").removeClass("active");
                groundOverlays.setImageURL('');
                yunType = '';
                yus = [];
                yuType = '';
                map.closeInfoWindow(); //关闭信息窗口
                // map.clearOverlays();
            } else if (mapType == "power") {
                $(".power-exp").css("display", "none");
                // enable();
                // toCity();
                // for (var i = powerDots.length - 1; i >= 0; i--) {
                //     map.removeOverlay(powerDots[i]);
                // }
                // powerDots=[];
                for (var i = townships.length - 1; i >= 0; i--) {
                    townships[i].setFillColor("#42d0fe");
                }
                for (var i = citys.length - 1; i >= 0; i--) {
                    citys[i].setFillColor("#42d0fe");
                }
                // heatmapOverlay.hide();
            } else if (mapType == "repair") {
                // enable();
                for (var i = repairDots.length - 1; i >= 0; i--) {
                    map.removeOverlay(repairDots[i]);
                }
                repairDots = [];
            } else if (mapType == "platform") {
                // enable();
                map.removeOverlay(taiQuBg);
            } else if (mapType == "fight") {
                // addBlackOverlay();
                // $('.fight-exp').hide();
                // $('.fight-btn').hide();
                // $('.fight-btn2').hide();
                $('.fight-btn3').hide();
                // $('.fight-btn4').hide();
                // $('.fight-list').hide();
                // $('.fight-list2').hide();
                // $('.fight-list3').hide();
                // $('header').removeClass('header-bg');
                // $('footer').removeClass('footer-bg');

                // for (var i = citys.length - 1; i >= 0; i--) {
                //     citys[i].show();
                // }
                for (var i = fightDots.length - 1; i >= 0; i--) {
                    map.removeOverlay(fightDots[i]);
                }
                fightDots = [];
                // for (var i = ganLines.length - 1; i >= 0; i--){
                //     map.removeOverlay(ganLines[i]);
                // }
                // ganLines=[];
            } else if (mapType == 'disaster') {
                // enable();
                for (var i = disasterDots.length - 1; i >= 0; i--) {
                    map.removeOverlay(disasterDots[i]);
                }
                disasterDots = [];
            }
        }
        //禁用地图功能
        function disable() {
            map.centerAndZoom(wz, 11);          // 初始化地图,设置中心点坐标和地图级别
            map.disableDragging();              //禁用地图拖拽
            map.disableScrollWheelZoom();       //禁用滚轮放大缩小
            map.disableKeyboard();              //禁用键盘操作
            map.disableDoubleClickZoom();       //禁用双击放大
        }
        //启用地图功能
        function enable() {
            map.enableDragging();               //禁用地图拖拽
            map.enableScrollWheelZoom();        //禁用滚轮放大缩小
            map.enableKeyboard();               //禁用键盘操作
            map.enableDoubleClickZoom();        //禁用双击放大
        }
        //数据更新
        function upData() {
            setInterval(function () {
                $.ajax({
                    url: basepath + "/warningConfiguration/dp/idType",
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.data == 200) {
                            getSubDisconnection();
                            getSubTopple();
                            getSubDamaged();
                            getwzPowerLossing();
                        }
                    }
                });
                getSubstation220();
                getSubstation110();
                getSubstation35();
                getTrans220();
                getTrans110();
                getTrans35();
            }, 30000);

        }

        function addYu(data) {
            if (yuType != data) {
                $('body').removeClass('loaded');
                $.ajax({
                    url: basepath + "/wt/out/findpic/" + data,
                    type: 'get',
                    contentType: 'application/json',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200) {
                            for (var i = yus.length - 1; i >= 0; i--) {
                                map.removeOverlay(yus[i]);
                            }
                            yus = [];
                            yuType = data;
                            for (var i = 0; i < res.data.length; i++) {
                                var point = '';
                                //三维数组数据渲染
                                for (var j = 0; j < res.data[i].latAndLong.length; j++) {
                                    point = point + res.data[i].latAndLong[j][1] + ',' + res.data[i].latAndLong[j][0] + ';';
                                }
                                var ply = new BMap.Polygon(point, { strokeColor: 'none' });
                                ply.setFillColor('#00deed');
                                ply.setFillOpacity(0.2);
                                yus.push(ply);
                                map.addOverlay(ply);  //添加覆盖物
                            }

                        }
                    },
                    complete: function () {
                        $('body').addClass('loaded');
                    }
                });
            } else {
                for (var i = yus.length - 1; i >= 0; i--) {
                    map.removeOverlay(yus[i]);
                }
                yus = [];
                yuType = '';
            }

        }

        function addYun(data) {
            if (yunType != data) {
                $('body').removeClass('loaded');
                $.ajax({
                    url: basepath + "/wt/out/cloud",
                    type: 'post',
                    contentType: 'application/json',
                    dataType: 'json',
                    data: data,
                    success: function (res) {
                        if (res.code == 200) {
                            yunType = data;
                            groundOverlays.setImageURL(res.data.path);
                        }
                    },
                    complete: function () {
                        $('body').addClass('loaded');
                    }
                });
            } else {
                groundOverlays.setImageURL('');
                yunType = '';
            }
        }
        //------------------------ 历史台风 ------------------
        //获取台风数据
        function getYear() {
            $.ajax({
                url: basepath + "/typhoon/years",
                type: 'get',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200) {

                        var list = res.data;
                        $(".select-time-list").html("");
                        getTyphoonByYear(list[0]);
                        for (var i = 0; i < list.length; i++) {
                            $("<div class='aside-user-item'>" + list[i] + "</div>").appendTo(".select-time-list");
                        }
                        $(".select-time p").text(list[0]);

                    }
                }
            });
        }
        var tfId = 0;
        function getTyphoonByYear(year) {
            $.ajax({
                url: basepath + "/typhoon/year/" + year,
                type: 'get',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200) {
                        tfId = res.data[0].tfid;
                        // toHistory();
                        var list = res.data;
                        $(".mySelect-list").html("");
                        for (var i = 0; i < list.length; i++) {
                            $("<div class='aside-user-item'><div class='aside-user-txt2' id='" + list[i].tfid + "'>" + list[i].name + "</div>").appendTo(".mySelect-list");
                        }
                        // $(".mySelect p").text(list[0].name);

                    }
                }
            });
        }

        //获取台风信息
        var oldName = '';
        function getTF(id) {
            $('body').addClass('loaded');
            $.ajax({
                url: basepath + "/typhoon/point/" + id,
                type: 'get',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200 && res.data) {

                        var points = res.data.map(function (key, value) {
                            return value = new BMap.Point(key.lng, key.lat);
                        });


                        // close();
                        // map.setZoom(8);
                        // mapType="typhoon";
                        tfId = id;
                        oldName = (res.data[0] || {}).tfName || '';
                        run(points, res.data);
                        lastDot = (res.data[res.data.length - 1] || {}).power || 0;
                    }
                }
            });
        }
        function getDamagedMainNew(id) {
            $.ajax({
                type: "get",
                async: false,
                url: basepath + "/history/damaged/" + id,
                contentType: 'application/json',
                dataType: "json",
                success: function (res) {
                    var data = res.data;
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt1:eq(0) .aside-count").text(data.circuitAmount || 0);//线路总量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt2 .aside-count").text(data.damagedAmount || 0);//受损数量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt2 .aside-count-item:eq(0)").text(data.toppleAmount ? '倒杆数量 ..... ' + data.toppleAmount : '倒杆数量 ..... 0');//倒杆��量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt2 .aside-count-item:eq(1)").text(data.disconnectionAmount ? '断线数量 ..... ' + data.disconnectionAmount : '断线数量 ..... 0');//断线数量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt1:eq(1) .aside-count").text(data.damagedRate || 0);//受损占比

                    var circle = data.damagedRate ? Math.floor(data.damagedRate * 360) : 0;
                    if (circle > 180) {
                        circle = 360 - circle;
                        $("#subContext81 .aside-circle-right-deg").css("transform", "rotate(0deg" + ")");
                        $("#subContext81 .aside-circle-left-deg").css("transform", "rotate(-" + circle + "deg" + ")");
                    } else {
                        circle = 180 - circle;
                        $("#subContext81 .aside-circle-right-deg").css("transform", "rotate(-" + circle + "deg" + ")");
                    }

                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(0) .aside-count").text(data.substationAmount || 0);//线路总量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(1) .aside-count").text(data.substationDamagedNumber || 0);//受损数量
                    $("#subContext8 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(2) .aside-count").text(data.substationRate || 0);//受损占比

                    var circle2 = data.substationRate ? Math.floor(data.substationRate * 360) : 0;
                    if (circle2 > 180) {
                        circle2 = 360 - circle2;
                        $("#subContext82 .aside-circle-right-deg").css("transform", "rotate(0deg" + ")");
                        $("#subContext82 .aside-circle-left-deg").css("transform", "rotate(-" + circle2 + "deg" + ")");
                    } else {
                        circle2 = 180 - circle2;
                        $("#subContext82 .aside-circle-right-deg").css("transform", "rotate(-" + circle2 + "deg" + ")");
                    }
                },
                error: function () {
                    console.log('fail');
                }
            });
        }
        function getTripMainNew(id) {
            $.ajax({
                type: "get",
                async: false,
                url: basepath + "history/damaged/" + id,
                contentType: 'application/json',
                dataType: "json",
                data: {},
                success: function (res) {
                    var data = res.data;
                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(0) .aside-count").text(data.circuitAmount || 0);//线路总量
                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(1) .aside-count").text(data.circuitTripNumber || 0);//受损数量
                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(2) .aside-count").text(data.circuitRate || 0);//受损占比

                    var circle = data.damagedRate ? Math.floor(data.damagedRate * 360) : 0;
                    if (circle > 180) {
                        circle = 360 - circle;
                        $("#subContext81 .aside-circle-right-deg").css("transform", "rotate(0deg" + ")");
                        $("#subContext81 .aside-circle-left-deg").css("transform", "rotate(-" + circle + "deg" + ")");
                    } else {
                        circle = 180 - circle;
                        $("#subContext81 .aside-circle-right-deg").css("transform", "rotate(-" + circle + "deg" + ")");
                    }

                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(0) .aside-count").text(data.substationAmount || 0);//线路总量
                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(1) .aside-count").text(data.substationTripAmount || 0);//受损数量
                    $("#subContext8 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(2) .aside-count").text(data.substationRate || 0);//受损占比

                    var circle2 = data.substationRate ? Math.floor(data.substationRate * 360) : 0;
                    if (circle2 > 180) {
                        circle2 = 360 - circle2;
                        $("#subContext82 .aside-circle-right-deg").css("transform", "rotate(0deg" + ")");
                        $("#subContext82 .aside-circle-left-deg").css("transform", "rotate(-" + circle2 + "deg" + ")");
                    } else {
                        circle2 = 180 - circle2;
                        $("#subContext82 .aside-circle-right-deg").css("transform", "rotate(-" + circle2 + "deg" + ")");
                    }
                },
                error: function () {
                    console.log('fail');
                }
            });
        }

        function getDamagedBranchNew(id) {

            $.ajax({
                type: "get",
                async: false,
                url: basepath + "/history/damaged/" + id,
                contentType: 'application/json',
                dataType: "json",
                data: {},
                success: function (res) {

                    var data = res.data;
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt1:eq(0) .aside-count").text(data.circuitAmount || 0);//总数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt1:eq(1) .aside-count").text(data.damagedAmount || 0);//跳闸数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(0) .aside-txt1:eq(2) .aside-count").text(data.damagedRate || 0);//跳闸数量

                    _3dCharts1("_3dCharts1", data.circuitAmount || 360, data.damagedAmount || 0); //100/50

                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(0) .aside-count").text(data.toppleAmount || 0);//总数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(1) .aside-count").text(data.toppleDamagedNumber || 0);//跳闸数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(1) .aside-txt1:eq(2) .aside-count").text(data.toppleDamagedRate || 0);//跳闸数量

                    _3dCharts1("_3dCharts2", data.toppleAmount || 360, data.toppleDamagedNumber || 0);

                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(2) .aside-txt1:eq(0) .aside-count").text(data.substationAmount || 0);//总数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(2) .aside-txt1:eq(1) .aside-count").text(data.substationDamagedNumber || 0);//跳闸数量
                    $("#subContext9 .aside-context:eq(0) .aside-subContext:eq(2) .aside-txt1:eq(2) .aside-count").text(data.substationRate || 0);//跳闸数量

                    _3dCharts1("_3dCharts3", data.substationAmount || 360, data.substationDamagedNumber || 0);
                },
                error: function () {
                    console.log('fail');
                }
            });
        }
        function getTripBranchNew(id) {
            $.ajax({
                type: "get",
                async: false,
                url: basepath + "/history/damaged/" + id,
                contentType: 'application/json',
                dataType: "json",
                data: {},
                success: function (res) {
                    var data = res.data;
                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(0) .aside-count").text(data.circuitAmount || 0);//总数量
                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(1) .aside-count").text(data.circuitTripNumber || 0);//跳闸数量
                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(0) .aside-txt1:eq(2) .aside-count").text(data.circuitRate || 0);//跳闸数量

                    _3dCharts1("_3dCharts4", data.circuitAmount || 360, data.circuitDamagedNumber || 0);

                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(0) .aside-count").text(data.substationAmount || 0);//总数量
                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(1) .aside-count").text(data.substationTripAmount || 0);//跳闸数量
                    $("#subContext9 .aside-context:eq(1) .aside-subContext:eq(1) .aside-txt1:eq(2) .aside-count").text(data.substationRate || 0);//跳闸数量

                    _3dCharts1("_3dCharts5", data.toppleAmount || 360, data.toppleDamagedNumber || 0);
                },
                error: function () {
                    console.log('fail');
                }
            });
        }


        //台风跑起来
        function run(point, data) {
            //离线地图台风运动
            var i = 0;
            var oldType = mapType;
            isRun = true;
            var interval = setInterval(function () {
                if ((i >= point.length || mapType != oldType) || (oldName != data[0].tfName || !isRun)) {
                    clearInterval(interval);
                    return;
                }

                // drowLine(map,point[i],point[i+1]);//画线调用

                if (point[i + 1] != undefined) {
                    //创建折线
                    var polyline = new BMap.Polyline([point[i], point[i + 1]], { strokeColor: "white", strokeWeight: 2 });
                    map.addOverlay(polyline);
                    polyline.mapType = mapType;
                    typhoonLines.push(polyline);
                    addMarkerEnd(point[i + 1], '台风移动', i, point[i + 1], point[i]);//添加图标
                    line(i, data);

                } else {
                    /*  if (mapType == "active") {
                             getForecast(data[data.length - 1].id, point[data.length - 1], oldType);
                         } */
                    addMarkerEnd(point[i], '终点', i);//添加终点图标
                    line(i, data);
                }
                i = i + 1;
            }, 100);
        }
        // var iconDot1 = new BMap.Icon("./static/img/dot1.png", new BMap.Size(12,12));//热带风暴
        // var iconDot2 = new BMap.Icon("./static/img/dot2.png", new BMap.Size(12,12));//超热带风暴
        // var iconDot3 = new BMap.Icon("./static/img/dot3.png", new BMap.Size(12,12));//台风
        // var iconDot4 = new BMap.Icon("./static/img/dot4.png", new BMap.Size(12,12));//超台风
        // var iconDot5 = new BMap.Icon("./static/img/dot5.png", new BMap.Size(12,12));//超强台风
        function line(i, data) {
            //创建标注点
            // var iconDot=iconDot1;
            if (data[i].power <= 9) {
                var color = 'dot_blue';
            } else if (data[i].power <= 11) {
                var color = 'dot_yellow';
            } else if (data[i].power <= 13) {
                var color = 'dot_pink';
            } else if (data[i].power <= 15) {
                var color = 'dot_orange';
            } else if (data[i].power >= 16) {
                var color = 'dot_red';
            }
            // var marker = new BMap.Marker(new BMap.Point(data[i].lng, data[i].lat),{
            //     icon:iconDot,
            //     title:'路径信息'
            // });  // 创建标注
            var point = new BMap.Point(data[i].lng, data[i].lat);
            var label = new BMap.Label('\<p class="iconDot ' + color + '"\>\</p\>', { position: point, offset: new BMap.Size(-5, -5) });
            label.setZIndex(999);

            label.setStyle({ border: 0, background: '', padding: 0 });
            map.addOverlay(label);    //增加点
            label.mapType = mapType;
            typhoonDots.push(label);

            //弹窗
            var sContent = "<div class='myPop'>" +
                "<div class='myPopTitle'>" +
                "<h6>" + data[i].tfName + "</h6>" +
                "</div>" +
                "<div class='myPopInfo'>" +
                "<p><span>过去时间丨</span>" + data[i].time + "</p>" +
                "<p><span>中心位置丨</span>" + data[i].lng + "°E" + data[i].lat + "°N" + "</p>" +
                "<p><span>最大风力丨</span>" + data[i].power + "</p>" +
                "<p><span>最大风速丨</span>" + data[i].speed + "</p>" +
                "<p><span>中心气压丨</span>" + data[i].pressure + "</p>" +
                "</div>" +
                "<div class='myPopInfo'>" +
                "<p><span>移动速度丨</span>" + data[i].movespeed + "</p>" +
                "<p><span>移动方向丨</span>" + data[i].movedirection + "</p>" +
                "<p><span>07级风圈半径丨</span>" + data[i].radius7 + "</p>" +
                "<p><span>10级风圈半径丨</span>" + data[i].radius10 + "</p>" +
                "<p><span>12级风圈半径丨</span>" + data[i].radius12 + "</p>" +
                "</div>" +
                "</div>";
            addClickHandler(sContent, label);
        }

        //添加行驶和终点图标
        function addMarkerEnd(point, name, i, trackUnit, prePoint) {
            var zoom = map.getZoom() - 7 < 0 ? 0.5 : Math.pow(2, map.getZoom() - 8 - 1);
            var size = zoom * lastDot * 34;
            var TFIcon = new BMap.Icon("./static/img/taifeng.png", new BMap.Size(size, size), {    //小车图片
                imageOffset: new BMap.Size(0, 0)    //图片的偏移量。为了是图片底部中心对准坐标点。
            });
            TFIcon.setImageSize(new BMap.Size(size, size))
            if (name == "台风移动") {
                if (carMk) {//先判断第一次进来的时候这个值有没有定义，有的话就清除掉上一次的。然后在进行画图标。第一次进来时候没有定义也就不走这块，直接进行画图标
                    map.removeOverlay(carMk);
                }
                carMk = new BMap.Marker(point, { icon: TFIcon });  // 创建标注
                carMk.setRotation(i * 10);//trackUnit.route
                //getAngle(point,prePoint);// js求解两点之间的角度
                // carMk.setRotation(getAngle(point,prePoint)-90);// 旋转的角度
                map.addOverlay(carMk);               // 将标注添加到地图中
            } else {
                map.removeOverlay(carMk);
                var lastTF = new BMap.Marker(point, { icon: TFIcon });  // 创建标注
                lastTF.setRotation(i * 10);
                var s = i * 10;
                var interval = setInterval(function () {
                    if (mapType != "active") {
                        clearInterval(interval);
                    } else {
                        angle = s;
                        lastTF.setRotation(s);
                        s++;
                    }
                }, 100);
                map.addOverlay(lastTF);
                lastTF.mapType = mapType;
                lastCarMk.push(lastTF);
                isRun = false;
            }
        }

        //弹出窗口
        var phoonTime = { startTime: null, endTime: null };
        function addClickHandler(sContent, marker, form, data) {
            if (form == "repair") {
                marker.addEventListener("click", function (e) {
                    // $('.repair-chart').show();
                    var point = new BMap.Point(e.target.getPosition().lng, e.target.getPosition().lat);
                    var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
                    map.openInfoWindow(infoWindow, point); //开启信息窗口
                    setTimeout(_Charts3(data.detail), 500);
                    $('.repair-chart-title').text(data.name);
                    event.stopPropagation();
                });
                return;
            }
            if (form == "fight") {
                marker.addEventListener("click", function (e) {
                    fightDetail(sContent);
                    event.stopPropagation();
                })
                return;
            }
            if (form == "task") {
                marker.addEventListener("click", function (e) {
                    taskDetail(sContent, 2);

                    event.stopPropagation();
                })
                return;
            }
            if (form == "taskPoint") {
                marker.addEventListener("click", function (e) {
                    taskDetail(sContent, 1);
                    event.stopPropagation();
                })
                return;
            }
            if (form == "gan") {
                marker.addEventListener("mouseover", function (e) {
                    sContent.show();
                    marker.setStrokeWeight(4);
                    event.stopPropagation();
                })
                marker.addEventListener("mouseout", function (e) {
                    sContent.hide();
                    marker.setStrokeWeight(2);
                    event.stopPropagation();
                });
                return;
            }
            // if (form=='disaster'){
            //     marker.addEventListener("click",function (e) {
            //         var point = new BMap.Point(e.target.getPosition().lng, e.target.getPosition().lat);
            //         var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
            //         map.openInfoWindow(infoWindow,point); //开启信息窗口
            //         event.stopPropagation();
            //     })
            //     return;
            // }
            marker.addEventListener("mouseover", function (e) {
                var point = form == "line" ? new BMap.Point(e.point.lng, e.point.lat) : new BMap.Point(e.target.getPosition().lng, e.target.getPosition().lat);
                var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
                map.openInfoWindow(infoWindow, point); //开启信息窗口

            });
            marker.addEventListener("mouseout", function (e) {
                var point = form == "line" ? new BMap.Point(e.point.lng, e.point.lat) : new BMap.Point(e.target.getPosition().lng, e.target.getPosition().lat);
                var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
                map.closeInfoWindow(infoWindow, point); //开启信息窗口
            });
        }

        //------------台区布局图--------------
        function toPlatform() {
            $('.countiesBox').addClass('hidden');
            if (mapType != "platform") {
                addTaiQu();
                close();
                mapType = "platform";
            } else {
                close();
                toActive();
            }
        }


        //-------------------地质灾害隐患点------------------------
        function toDisaster() {
            if (mapType != "disaster") {
                // close();
                //循环建立标注点
                // mapType="disaster";
                // disable();
                $.ajax({
                    url: basepath + "/landDamage/list",
                    type: 'get',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200) {
                            // var myIcon = new BMap.Icon("../static/img/icon_fight1.png", new BMap.Size(20,20));
                            for (var i = 0; i < res.data.length; i++) {
                                if (!res.data[i].longitude && !res.data[i].latitude) {
                                    return;
                                }
                                var tmpLabel = new BMap.Label('<p class="icon iconfont icon_yellow min_font"></p>', { position: new BMap.Point(res.data[i].longitude, res.data[i].latitude), offset: new BMap.Size(-1.5, -1.5) });
                                tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                                tmpLabel.setZIndex(999);

                                map.addOverlay(tmpLabel);  //将标注点添加到地图上
                                tmpLabel.maxContent = '<p class="icon iconfont icon_yellow">&#xe601;</p>';
                                tmpLabel.minContent = '<p class="icon iconfont icon_yellow min_font"></p>';
                                fightDotsOpen = false;
                                disasterDots.push(tmpLabel);
                                disasterDots[i].hide();
                                //弹窗
                                var sContent = "<div class='powerPop'>" + res.data[i].content + "</div>";
                                addClickHandler(sContent, tmpLabel, 'disaster');
                            }
                        }
                    },
                    error: function () {
                        console.log('请求错误')
                    }
                });
            } else {
                close();
                toActive();
            }
        }

        //------------北斗基站--------------
        function toRepair() {
            if (mapType != "repair") {
                // $(".myTip").hide();
                // close();
                // mapType="repair";
                $.ajax({
                    url: basepath + "/beidou/switch/list",
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200 && res.data && $('.active-exp ul').eq(2).children("li").eq(0).children("i").hasClass('onIcon')) {
                            res.data.push({ id: 0, name: '无效坐标点', lng: '10', lat: '10', detail: { kwh: [], time: [] } })
                            // var repairPoints=res.data.map(function(key,value){
                            //     return value={points:new BMap.Point(key.lng, key.lat)};
                            // });
                            //循环建立标注点
                            // var myIcon = new BMap.Icon("./static/img/icon_repair1.png", new BMap.Size(20,20));
                            // myIcon.setImageSize( new BMap.Size(20,20));
                            for (var i = 0; i < res.data.length; i++) {
                                // var marker = new BMap.Marker(repairPoints[i].points,{icon:myIcon}); //将点转化成标注点
                                var tmpLabel = new BMap.Label('<span class="icon iconfont icon_blue">&#xe602;</span>', { position: new BMap.Point(res.data[i].lng, res.data[i].lat), offset: new BMap.Size(-7, -7) });
                                tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                                tmpLabel.setZIndex(999);
                                map.addOverlay(tmpLabel);  //将标注点添加到地图上
                                repairDots.push(tmpLabel);
                                //弹窗
                                var sContent = "<div class='powerPop'>" +
                                    "        <div class=\"repair-chart\">\n" +
                                    "            <div style=\"padding: 2rem 0 0.5rem;\">\n" +
                                    "                <div class=\"repair-chart-title\">请重新点击地图坐标</div>\n" +
                                    "                <div class=\"chart\" id=\"chart3\"></div>\n" +
                                    // "                <span>正在加载信息，请重新点击</span>\n"+
                                    "            </div>\n" +
                                    "        </div>" +
                                    "</div>";

                                addClickHandler(sContent, tmpLabel, 'repair', res.data[i]);
                            }
                        }
                    },
                    error: function (res) {
                        console.log('请求错误7')
                    },
                    complete: function () {
                        $('body').addClass('loaded');
                    }
                });
            }
        }


        //------------------------当前台风----------------------
        function toActive() {
            if (mapType != "active") {
                isRun = true;
                //close();
                //暂时
                // $(".fight-table").html('<div class="fight-title">\
                //     <div class="fight-title-item">创建时间</div>\
                //     <div class="fight-title-item">抢修负责人</div>\
                //     <div class="fight-title-item">负责人号码</div>\
                //     <div class="fight-title-item">任务描述</div>\
                //     <div class="fight-title-item">计划进度</div>\
                // </div>');
                // taskDots=[];
                //---
                $(".mySelect").show();
                $(".mySelect p").text('请选择');
                mapType = "active";
                $(".tap-item").siblings().eq(1).hasClass('tap-item-active') ? $(".myTip").show() : $(".myTip").hide();
                // if ($('.tag2-right').is(':hidden')) {
                //     $(".aside-right").addClass("hide");
                //     $(".tag2-right").show();
                //     $(".fight-btn4").removeClass("toRight");
                //     $(".fight-btn").removeClass("toRight");
                // }
                // if ($('.tag2-left').is(':hidden')) {
                //     $(".aside-left").addClass("hide");
                //     $(".tag2-left").show();
                //     $(".realTime-list").removeClass("toLeft");
                //     $(".power-exp").removeClass("toLeft");
                //     $(".active-exp").removeClass("toLeft");
                // }

                //当前台风绘制
                $.ajax({
                    url: basepath + "/typhoon/listAllIsActive",
                    type: 'get',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200) {

                            for (var i = res.data.length - 1; i >= 0; i--) {
                                getTF(res.data[i].tfid);
                            }
                        }
                    }
                });

            }
        }

        //获取倒杆线路
        function getGanData() {
            $.ajax({
                url: basepath + "/fault/coordinateList",
                type: 'post',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200) {
                        var ganData = res.data;
                        //主网倒杆线路图绘制
                        for (var j = 0; j < ganData.length; j++) {
                            var ponints = [];
                            if ((ganData[j].voltageGrade === '35kV' && $('.active-exp ul').eq(0).children("li").eq(0).children("i").hasClass('onIcon')) || (ganData[j].voltageGrade === '110kV' && $('.active-exp ul').eq(0).children("li").eq(1).children("i").hasClass('onIcon')) || (ganData[j].voltageGrade === '220kV' && $('.active-exp ul').eq(0).children("li").eq(2).children("i").hasClass('onIcon'))) {
                                for (var i = 0; i < ganData[j].coordinateList.length; i++) {
                                    ponints.push(new BMap.Point(ganData[j].coordinateList[i].lng, ganData[j].coordinateList[i].lat));
                                }
                                var label = new BMap.Label(ganData[j].name, {
                                    position: ponints[0],    // 指定文本标注所在的地理位置
                                    offset: new BMap.Size(30, -30)    //设置文本偏移量
                                });  // 创建文本标注对象
                                label.setStyle({
                                    color: "red",
                                    fontSize: "12px",
                                    height: "20px",
                                    lineHeight: "20px",
                                    fontFamily: "微软雅黑"
                                });
                                map.addOverlay(label);

                                var ply = new BMap.Polyline(ponints, { strokeWeight: 2, strokeColor: ganData[j].color || '#00faec' }); //建立多边形覆盖物

                                map.addOverlay(ply);  //添加覆盖物
                                addClickHandler(label, ply, 'gan')
                                ply.lineType = ganData[j].voltageGrade;

                                ply.ganId = ganData[j].id;
                                ply.latLng = ganData[j].coordinateList;
                                label.lineType = ganData[j].voltageGrade;
                                ganLabel.push(label);
                                ganLines.push(ply);
                                ganLabel[j].hide();
                                fightDotsOpen = false

                            } else {
                                continue;
                            }

                        }
                    }
                },
                error: function () {
                    console.log('请求错误9')
                }
            });
        }


        function taskPoint() {
            $.ajax({
                url: basepath + "/fault/point",
                type: 'post',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200) {
                        for (var i = 0; i < res.data.length; i++) {
                            if (res.data[i].lng) {
                                var Icon = new BMap.Icon("./static/img/icon-task.png", new BMap.Size(24, 24));
                                var marker = new BMap.Marker(new BMap.Point(res.data[i].lng, res.data[i].lat), { icon: Icon });  // 创建标注
                                map.addOverlay(marker);  //将标注点添加到地图上
                                taskDots.push(marker);
                                //弹窗
                                var point = new BMap.Point(res.data[i].lng, res.data[i].lat);
                                var opts = {
                                    position: point,    // 指定文本标注所在的地理位置
                                    offset: new BMap.Size(10, -10)    //设置文本偏移量
                                }
                                asdasd = new BMap.Label('抢修人数：' + res.data[i].teamNumber + '人', opts);  // 创建文本标注对象
                                asdasd.setStyle({
                                    color: "red",
                                    fontSize: "12px",
                                    height: "20px",
                                    lineHeight: "20px",
                                    fontFamily: "微软雅黑",
                                });
                                asdasdbox.push(asdasd);
                                map.addOverlay(asdasd);
                                addClickHandler(res.data[i], marker, 'taskPoint');
                            }
                        }
                        for (let i = 0; i < asdasdbox.length; i++) {
                            asdasdbox[i].hide();
                        }
                    }
                },
                error: function () {
                    console.log('请求错误11')
                }
            });
        }

        function Chat(e) {//跳转到即时通讯页面
            var cookie = document.cookie;
            var cookieArray = cookie.split("; ");
            var cookieObj = {};
            for (let i = 0; i < cookieArray.length; i++) {
                var arr = cookieArray[i].split("=");
                cookieObj[arr[0]] = arr[1];
            }
            window.ImClick(cookieObj.accid, cookieObj.userName, e.target.dataset.chat.trim(), e.target.dataset.name);
        }
        function taskDetail(data, type) {
            if (type === 1) {
                console.log(data, type)
                //渲染详情
                $(".task-detail").html('<div class="task-detail-scrollbar">\
                <div class="detail_item">\
                        <div class="detail_item_title clearfix">\
                            <div class="left">\
                                <b> 抢修负责人</b> <span>'+ data.sitePrincipal + '</span>\
                            </div>\
                            <div class="right">\
                                <span class="iconfont iconphone backfff ft16" data-chat=" ' + data.yunxin_accid + '"  data-name="' + data.sitePrincipal + '" onclick="Chat(event)"></span>\
                            </div>\
                        </div>\
                    <div class="detail_item_item">\
                        <p><span>联系方式：</span>'+ data.sitePhone + '</p>\
                        <p><span>备用：</span>'+ data.teamPrincipalPhones + '</p>\
                    </div>\
                </div >\
                    <div class="detail_item">\
                    <div class="detail_item_title"><b>抢修队伍</b></div>\
                    <div class="detail_item_item">\
                        <p><span>名称：</span>'+ data.siteCompany + '</p>\
                        <p><span>人数：</span>'+ data.teamNumber + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>驻主乡镇：</span>'+ data.gridName + '</p>\
                    </div>\
                </div>\
                    <div class="detail_item material">\
                    <div class="detail_item_title"><b>队伍物资</b></div>\
                </div>\
                    <div class="detail_item">\
                    <div class="detail_item_title"><b>车辆</b></div>\
                    <span>'+ data.damageContent + '</span>\
                </div>\
                </div > ');
                for (var i in data.teamCompanys) {
                    $('<div class="detail_item_item"><p><span>' + i + '：</span>' + data.teamCompanys[i] + '</p></div>').appendTo(".material");
                }
            } else {
                $(".task-detail").html('<div class="task-detail-scrollbar">\
                <div class="detail_item">\
                <img src="./static/img/task_tip.png" class="task_titleImg">\
                <div class="detail_item_title clearfix">\
                    <div class="left">\
                            <b> 任务明细</b>\
                        </div>\
                        <div class="right">\
                            <span class="iconfont iconphone backfff ft16" data-chat=" ' + data.yunxin_accid + '" data-name="' + data.sitePrincipal + '" onclick="Chat(event)"></span>\
                        </div>\
                </div>\
                    <div class="detail_item_item">\
                        <p><span>所属供电所：</span>'+ data.belongStation + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>队伍名称：</span>'+ data.teamName + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>任务名称：</span>'+ data.taskName + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>抢修人数：</span>'+ data.workerNumber + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>物资需求：</span>'+ data.demand + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>创建时间：</span>'+ data.createTime + '</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>抢修进度：</span>'+ data.progress + '%</p>\
                    </div>\
                    <div class="detail_item_item">\
                        <p><span>状态：</span>'+ data.statusArr + '</p>\
                    </div>\
                    <div class="detail_item_item planImg">\
                        <div class="plan-scrollbar">\
                        </div>\
                    </div>\
                </div >\
                </div > ');
                for (var j in data.file) {
                    if (data.file[j].type === 'video') {
                        $('<video controls src="' + data.file[j].img + '" class="zoom" width="200" height="100"></video>').appendTo(".plan-scrollbar");
                    } else {
                        $('<img id="aimg_' + i + data.file[j].id + '" name="' + data.file[j].type + '" aid="' + i + data.file[j].id + '" src="' + data.file[j].img + '" zoomfile="' + data.file[j].img + '" file="' + data.file[j].img + '" class="zoom" onclick="zoom(this, this.src, 0, 0, 0)" height="100" />').appendTo(".plan-scrollbar");
                        aimgcount[1000].push(data.file[j].id);
                    }
                }
                // aimgcount[1000] = [];
                attachimggroup(1000);
                attachimgshow(1000);
                var aimgfid = 0;
            }
            $('.task-detail').show().drag(20);
        }

        //获取当前台风预测路径
        function getForecast(id, point, type) {
            $.ajax({
                url: basepath + "/typhoon/forecast/" + id,
                type: 'get',
                dataType: 'json',
                success: function (res) {
                    if (res.code == 200 && type == mapType && res.data.length != 0) {

                        var points = res.data.map(function (key, value) {
                            return value = new BMap.Point(key.lng, key.lat);
                        });
                        var oldType = mapType;
                        for (var i = 0; i < points.length; i++) {
                            setTimeout(function (num) {
                                return function () {
                                    if (mapType != oldType) {
                                        return;
                                    }
                                    //标注点
                                    if (res.data[num].power <= 9) {
                                        var color = 'dot_blue';//热带风暴
                                    } else if (res.data[num].power <= 11) {
                                        var color = 'dot_yellow';//超热带风暴
                                    } else if (res.data[num].power <= 13) {
                                        var color = 'dot_orange';//台风
                                    } else if (res.data[num].power <= 15) {
                                        var color = 'dot_pink';//超台风
                                    } else if (res.data[num].power >= 16) {
                                        var color = 'dot_red';//超强台风
                                    }
                                    var label = new BMap.Label('\<p class="iconDot ' + color + '"\>\</p\>', { position: points[num], offset: new BMap.Size(-5, -5) });
                                    label.setZIndex(999);
                                    label.setStyle({ border: 0, background: '', padding: 0 });
                                    map.addOverlay(label);    //增加点
                                    typhoonDots.push(label);
                                    //弹窗
                                    // var sContent =  "<div class='myPop'>" +
                                    //     "<div class='myPopTitle'>" +
                                    //     "<h6>" + res.data[i].tfName + "</h6>" +
                                    //     "</div>" +
                                    //     "<div class='myPopInfo'>" +
                                    //     "<p><span>过去时间丨</span>" + res.data[i].time + "</p>" +
                                    //     "<p><span>中心位置丨</span>" + res.data[i].lng + "°E" + res.data[i].lat + "°N" + "</p>" +
                                    //     "<p><span>最大风力丨</span>" + res.data[i].power + "</p>" +
                                    //     "<p><span>最大风速丨</span>" + res.data[i].speed + "</p>" +
                                    //     "<p><span>中心气压丨</span>" + res.data[i].pressure + "</p>" +
                                    //     "</div>" +
                                    //     "<div class='myPopInfo'>" +
                                    //     "<p><span>移动速度丨</span>" + res.data[i].movespeed + "</p>" +
                                    //     "<p><span>移动方向丨</span>" + res.data[i].movedirection + "</p>" +
                                    //     "<p><span>07级风圈半径丨</span>" + res.data[i].radius7 + "</p>" +
                                    //     "<p><span>10级风圈半径丨</span>" + res.data[i].radius10 + "</p>" +
                                    //     "<p><span>12级风圈半径丨</span>" + res.data[i].radius12 + "</p>" +
                                    //     "</div>" +
                                    //     "</div>";
                                    // addClickHandler(sContent,marker2);
                                    //路线
                                    var lines = num == 0 ? [point, points[0]] : [points[num - 1], points[num]];
                                    var polyline2 = new BMap.Polyline(lines, { strokeColor: "white", strokeWeight: 2 });   //创建折线
                                    polyline2.setStrokeStyle('dashed');
                                    map.addOverlay(polyline2);  //增加线
                                    typhoonLines.push(polyline2);
                                }
                            }(i), i * 100)
                        }
                    }
                },
                error: function () {
                    console.log('请求错误10')
                }
            });
        }

        //--------------------作战地图---------------------
        function toFight() {
            if (mapType != "fight") {

                close();
                mapType = "fight";
                // map.removeOverlay(blackOverlay);
                // map.setMapType(BMAP_NORMAL_MAP);
                $(".realTime-list").removeClass("toLeft");
                $(".fight-btn4").removeClass("toRight");
                $('.absIcon').removeClass('absIconActive');
                $('.wechatIcon').removeClass("toRight");
                $('.search').removeClass("toRight");
                $(".fight-btn").removeClass("toRight");
                $(".power-exp").removeClass("toLeft");
                $(".active-exp").removeClass("toLeft");
                $('.fight-btn').show();
                // $('.fight-btn4').show();
                // map.setZoom(11);
                // map.setMinZoom(10);
                // var b = new BMap.Bounds(new BMap.Point(119.1770433326922,27.152465424195658),new BMap.Point(122.34597771308442,28.889646954689834));
                // try {
                //     BMapLib.AreaRestriction.setBounds(map, b);
                // } catch (e) {
                //     alert(e);
                // }
                for (var i = citys.length - 1; i >= 0; i--) {
                    citys[i].hide();
                }
                // $('header').addClass('header-bg');
                // $('footer').addClass('footer-bg');
                $(".aside-left").addClass("hide");
                $(".aside-right").addClass("hide");
                // $(".fight-table").html('<div class="fight-title">\
                //         <div class="fight-title-item">创建时间</div>\
                //         <div class="fight-title-item">任务编号</div>\
                //         <div class="fight-title-item">抢修负责人</div>\
                //         <div class="fight-title-item">抢修设备</div>\
                //         <div class="fight-title-item">任务描述</div>\
                //         <div class="fight-title-item">计划进度</div>\
                // </div>');
                $.ajax({
                    url: basepath + "/fault/list",
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200) {
                            fightList = res.data;
                            var myIcon = new BMap.Icon("./static/img/icon_meteorological.png", new BMap.Size(18, 21));
                            for (var i = 0; i < res.data.length; i++) {
                                if (!res.data[i].lng && !res.data[i].lat) {
                                    return;
                                }
                                //渲染列表
                                // if(res.data[i].attribute!=3){
                                //     $("<div class='fight-item' onclick='fightDetail("+JSON.stringify(res.data[i])+")'><div class='fight-item-cell'>" + formatDate(new Date(res.data[i].createTime)) + "</div><div class='fight-item-cell'>" + res.data[i].taskCode + "</div><div class='fight-item-cell'>" + res.data[i].sitePrincipal + "</div><div class='fight-item-cell'>" + res.data[i].voltageGrade + '/' + res.data[i].lineName + '/' + res.data[i].repair + "</div><div class='fight-item-cell'>" + res.data[i].repairTaskContent + "</div><div class='fight-item-cell'>" + res.data[i].progress + "</div></div>").appendTo(".fight-table");
                                // }
                                var marker = new BMap.Marker(new BMap.Point(res.data[i].lng, res.data[i].lat), { icon: myIcon });
                                if (res.data[i].attribute == 1) {
                                    res.data[i].status == 0 ? myIcon.setImageUrl("./static/img/icon_fight1.png") : myIcon.setImageUrl("./static/img/icon_fight2.png");
                                } else if (res.data[i].attribute == 2) {
                                    res.data[i].status == 0 ? myIcon.setImageUrl("./static/img/icon_fight3.png") : myIcon.setImageUrl("./static/img/icon_fight4.png");
                                } else if (res.data[i].attribute == 3) {
                                    res.data[i].status == 0 ? myIcon.setImageUrl("./static/img/icon_fight5.png") : myIcon.setImageUrl("./static/img/icon_fight6.png");
                                } else {
                                    continue;
                                }
                                myIcon.setImageSize(new BMap.Size(18, 21));
                                map.addOverlay(marker);  //将标注点添加到地图上
                                fightDots.push(marker);
                                //弹窗
                                addClickHandler(res.data[i], marker, 'fight');
                            }
                        }
                    },
                    error: function () {
                        console.log('请求错误11')
                    }
                });
            }
        }

        function getFightList(data) {
            $(".fight-table").html('<div class="fight-title">\
                    <div class="fight-title-item">队伍名称</div>\
                    <div class="fight-title-item">负责人</div>\
                    <div class="fight-title-item">所属供电所</div>\
                    <div class="fight-title-item">人数</div>\
                    <div class="fight-title-item">联系电话</div>\
            </div>');
            for (var i = 0; i < fightList.length; i++) {
                if (fightList[i].attribute == data || data == 0) {
                    //渲染列表
                    $("<div class='fight-item' onclick='fightDetail(" + JSON.stringify(fightList[i]) + ")'><div class='fight-item-cell'>" + fightList[i].siteCompany + "</div><div class='fight-item-cell'>" + fightList[i].sitePrincipal + "</div><div class='fight-item-cell'>" + fightList[i].belongStation + "</div><div class='fight-item-cell'>" + fightList[i].teamNumber + "</div><div class='fight-item-cell'>" + fightList[i].sitePhone + "</div></div>").appendTo(".fight-table");
                }
            }
        }

        $('.fight-nav-item').click(function (e) {
            $('.fight-nav-item').removeClass('on');
            $(this).addClass('on');
        })

        function fightDetail(data) {
            if (data.attribute == 3) {
                var img = '<img src="./static/img/fight_detail3.png" class="fight_titleImg">';
                $(".fight-detail").html(img +
                    '<img src="./static/img/fight_detail_img.png" class="fight_icon" onMouseOver="imgUp()" onMouseOut="imgDown()">\
                    <div class="fight_img"></div>\
                    <div class="detail_item">\
                        <div class="detail_item_title"><b>抢修负责人</b></div>\
                        <div class="detail_item_item">\
                            <p>姓名</p>\
                            <p>联系方式</p>\
                            <p>单位</p>\
                        </div>\
                        <div class="detail_item_item">\
                            <p>' + data.sitePrincipal + '</p>\
                    <p>' + data.sitePhone + '</p>\
                    <p>' + data.siteCompany + '</p>\
                </div>\
            </div>\
            <div class="detail_item team">\
                <div class="detail_item_title"><b>抢修队伍</b></span></div>\
                <div class="detail_item_item">\
                    <p>队伍数量</p>\
                    <p>队伍人数</p>\
                </div>\
                <div class="detail_item_item">\
                    <p>' + data.teamNumber + '</p>\
                    <p>' + data.teamNumbers + '</p>\
                </div>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>设备信息</b></div>\
                <div class="detail_item_item">\
                    <p class="col20">电压等级</p>\
                    <p class="col20">线路名称</p>\
                    <p class="col20">抢修范围</p>\
                    <p class="col20">网格名称</p>\
                    <p class="col20">线路条数</p>\
                </div>\
                <div class="detail_item_item">\
                    <p class="col20">' + data.voltageGrade + '</p>\
                    <p class="col20">' + data.lineName + '</p>\
                    <p class="col20">' + data.repair + '</p>\
                    <p class="col20">' + data.gridName + '</p>\
                    <p class="col20">' + data.lineNumber + '</p>\
                </div>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>设备受损描述</b></div>\
                <span>' + data.damageContent + '</span>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>抢修任务描述</b></div>\
                <span>' + data.repairTaskContent + '</span>\
            </div>');
            } else {
                var img = data.attribute == 1 ? '<img src="./static/img/fight_detail1.png" class="fight_titleImg">' : '<img src="./static/img/fight_detail2.png" class="fight_titleImg">';
                //渲染详情
                $(".fight-detail").html(img +
                    '<img src="./static/img/fight_detail_img.png" class="fight_icon" onMouseOver="imgUp()" onMouseOut="imgDown()">\
                <div class="fight_img"></div>\
                    <div class="detail_item">\
                        <div class="detail_item_title"><b>抢修负责人</b></div>\
                        <div class="detail_item_item">\
                            <p>姓名</p>\
                            <p>联系方式</p>\
                            <p>单位</p>\
                        </div>\
                        <div class="detail_item_item">\
                            <p>' + data.sitePrincipal + '</p>\
                    <p>' + data.sitePhone + '</p>\
                    <p>' + data.siteCompany + '</p>\
                </div>\
            </div>\
            <div class="detail_item team">\
                <div class="detail_item_title"><b>抢修队伍</b> <span>' + data.teamNumber + '支</span></div>\
                <div class="detail_item_item">\
                    <p>序号</p>\
                    <p>名称</p>\
                    <p>负责人</p>\
                    <p>联系方式</p>\
                </div>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>设备信息</b></div>\
                <div class="detail_item_item">\
                    <p>电压等级</p>\
                    <p>线路名称</p>\
                    <p>抢修范围</p>\
                </div>\
                <div class="detail_item_item">\
                    <p>' + data.voltageGrade + '</p>\
                    <p>' + data.lineName + '</p>\
                    <p>' + data.repair + '</p>\
                </div>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>设备受损描述</b></div>\
                <span>' + data.damageContent + '</span>\
            </div>\
            <div class="detail_item">\
                <div class="detail_item_title"><b>抢修任务描述</b><span>抢修进度：' + data.progress + '</span></div>\
                <span>' + data.repairTaskContent + '</span>\
            </div>\
            <div class="detail_item date">\
                <div class="detail_item_title"><b>抢修计划安排</b> <span>抢修工期：' + data.duration + '天</span></div>\
                <div class="detail_item_item">\
                    <p>日期</p>\
                    <p>任务</p>\
                </div>\
                <div class="date_item"></div>\
            </div>');
                var teamCompanys = data.teamCompanys.split(',');
                var teamPrincipals = data.teamPrincipals.split(',');
                var teamPrincipalPhones = data.teamPrincipalPhones.split(',');
                var plan = data.plan.split('$');
                for (var i = 0; teamCompanys.length > i; i++) {
                    $('<div class="detail_item_item"><p>' + i + 1 + '</p><p>' + teamCompanys[i] + '</p><p>' + teamPrincipals[i] + '</p><p>' + teamPrincipalPhones[i] + '</p></div>').appendTo(".team");
                }
                for (var i = 0; plan.length > i; i++) {
                    $('<div class="detail_item_item"><p>D' + (i + 1) + '</p><p>' + plan[i] + '</p></div>').appendTo(".date div:eq(2)");
                }
            }

            var damageImgUrls = data.damageImgUrls.split(',');
            for (var i = 0; damageImgUrls.length > i; i++) {
                $('<img src="' + '/web/typhoon/' + damageImgUrls[i] + '">').appendTo(".fight_img");
            }
            $('.fight-detail').show();
        }

        //筛选变电 输电 配电
        function select(m, n) {
            if ($('.active-exp ul').eq(m).children("li").eq(n).children("i").hasClass('onIcon')) {
                $('.active-exp ul').eq(m).children("li").eq(n).children("i").removeClass('onIcon');
                $('.active-exp-title i').removeClass('onIcon');
            } else {
                $('.active-exp ul').eq(m).children("li").eq(n).children("i").addClass('onIcon');
            }
            if (m === 0) {
                for (var i = ganLines.length - 1; i >= 0; i--) {
                    let n1 = $('.active-exp ul').eq(0).children("li").eq(0).children("i").hasClass('onIcon');
                    let n2 = $('.active-exp ul').eq(0).children("li").eq(1).children("i").hasClass('onIcon');
                    let n3 = $('.active-exp ul').eq(0).children("li").eq(2).children("i").hasClass('onIcon');
                    if ((ganLines[i].lineType === '35kV' && !n1) || (ganLines[i].lineType === '110kV' && !n2) || (ganLines[i].lineType === '220kV' && !n3)) {
                        ganLines[i].hide();
                    } else if ((ganLines[i].lineType === '35kV' && n1) || (ganLines[i].lineType === '110kV' && n2) || (ganLines[i].lineType === '220kV' && n3)) {
                        ganLines[i].show();
                    }
                    // if((ganLines[i].lineType==='35kV'&&!n1)||(ganLines[i].lineType==='110kV'&&!n2)||(ganLines[i].lineType==='220kV'&&!n3)){
                    //     ganLabel[i].hide();
                    // }else if((ganLines[i].lineType==='35kV'&&n1)||(ganLines[i].lineType==='110kV'&&n2)||(ganLines[i].lineType==='220kV'&&n3)){
                    //     ganLabel[i].show();
                    // }
                }
                return;
            }
            if (m === 1) {
                for (var i = heatDots.length - 1; i >= 0; i--) {
                    let n1 = $('.active-exp ul').eq(1).children("li").eq(0).children("i").hasClass('onIcon');
                    let n2 = $('.active-exp ul').eq(1).children("li").eq(1).children("i").hasClass('onIcon');
                    let n3 = $('.active-exp ul').eq(1).children("li").eq(2).children("i").hasClass('onIcon');
                    if ((heatDots[i].dotType === "35" && !n1) || (heatDots[i].dotType === '110' && !n2) || (heatDots[i].dotType === '220' && !n3)) {
                        heatDots[i].hide();
                    } else if ((heatDots[i].dotType === '35' && n1) || (heatDots[i].dotType === '110' && n2) || (heatDots[i].dotType === '220' && n3)) {
                        heatDots[i].show();
                    }
                }

            }
            let n1 = $('.active-exp ul').eq(m).children("li").eq(n).children("i").hasClass('onIcon');
            if (m === 2 && n === 0) {
                for (var i = repairDots.length - 1; i >= 0; i--) {
                    n1 ? repairDots[i].show() : repairDots[i].hide();
                }
            }
            if (m === 2 && n === 1) {
                for (var i = repairTaskDots.length - 1; i >= 0; i--) {
                    n1 ? repairTaskDots[i].show() : repairTaskDots[i].hide();
                }
            }
            if (m === 3 && n === 0) {
                for (var i = powerDots.length - 1; i >= 0; i--) {
                    n1 ? powerDots[i].show() : powerDots[i].hide();
                }
            }
            if (m === 3 && n === 1) {
                for (var i = disasterDots.length - 1; i >= 0; i--) {
                    n1 ? disasterDots[i].show() : disasterDots[i].hide();
                }
            }

            if (m === 4 && n === 0) {
                for (var i = importantTextDots.length - 1; i >= 0; i--) {
                    if (importantTextDots[i].status) {
                        n1 ? importantTextDots[i].show() : importantTextDots[i].hide()
                    }
                }
            }
            if (m === 5 && n === 0) {


                for (let i = 0; i < asdasdbox.length; i++) {
                    if (n1) {
                        asdasdbox[i].show();
                    } else {
                        asdasdbox[i].hide();
                    }

                }

            }
        }
        //全选
        $(".active-exp-title i,active-exp-title span").click(function () {
            if ($('.active-exp-title i').hasClass('onIcon')) {
                // 取消全部选项

                for (var i = ganLines.length - 1; i >= 0; i--) {
                    ganLines[i].hide();
                }
                for (var i = heatDots.length - 1; i >= 0; i--) {
                    heatDots[i].hide();
                }
                // for (var i = ganLabel.length - 1; i >= 0; i--) {
                //     ganLabel[i].hide();
                // }
                for (var i = repairDots.length - 1; i >= 0; i--) {
                    repairDots[i].hide();
                }
                for (var i = disasterDots.length - 1; i >= 0; i--) {
                    disasterDots[i].hide();
                }
                for (var i = powerDots.length - 1; i >= 0; i--) {
                    powerDots[i].hide();
                }
                for (var i = repairTaskDots.length - 1; i >= 0; i--) {
                    repairTaskDots[i].hide();
                }
                for (var i = importantTextDots.length - 1; i >= 0; i--) {
                    importantTextDots[i].hide();
                }
                for (let i = 0; i < asdasdbox.length; i++) {
                    asdasdbox[i].hide();
                }
                $('.active-exp ul li i,.active-exp-title i').removeClass('onIcon');

            } else {
                //选中全部选项
                let len = $(".active-exp ul").length - 1
                for (var m = 0; m <= len; m++) {
                    let li = $('.active-exp ul').eq(m).children("li");
                    for (var n = 0; n <= li.length; n++) {
                        if (!$('.active-exp ul').eq(m).children("li").eq(n).children("i").hasClass('onIcon')) {
                            select(m, n);
                        }
                    }
                }
                $('.active-exp ul li i,.active-exp-title i').addClass('onIcon');
            }
        })

        function imgUp() {
            $('.fight_img').show();
        }

        function imgDown() {
            $('.fight_img').hide();
        }

        $('.fight-btn').click(function () {
            // if ($('.fight-list').is(':hidden')&&$('.fight-btn3').is(':hidden')){
            //     $('.fight-btn3-item').eq(0).children().eq(0).attr("src", './static/img/icon_fightPop1.png');
            //     // $('.fight-btn3-item').eq(1).children().eq(0).attr("src", './static/img/icon_fightPop4.png');
            //     $('.fight-btn3-item').eq(1).children().eq(0).attr("src", './static/img/icon_fightPop6.png');
            //     $('.fight-btn3-item').removeClass('active');
            //     $('.fight-btn3-item').eq(0).addClass('active');
            //     $('.fight-list').show(500);
            //     $('.fight-btn3').show(300);
            // }else {
            //     $('.fight-list').hide(500);
            //     // $('.fight-list3').hide(500);
            //     $('.fight-btn3').hide(300);
            // }
            $('.fight-list').toggle(500).drag(20);
            event.stopPropagation();
        })

        // $('.fight-btn2').click(function () {
        //     if ($('.fight-list2').is(':hidden')){
        //         $('.fight-list2').html('<div class="fight_tip_bg">抢修总览</div>');
        //         $.ajax({
        //             url: basepath +"/fault/countByAttribute",
        //             type: 'post',
        //             contentType: 'application/json',
        //             data: JSON.stringify({attribute:1}),
        //             dataType:'json',
        //             success: function(res){
        //                 if (res.code==200) {
        //                     //渲染列表
        //                     $("<div class='list_item'>\
        //                     <img src='./static/img/fight_tip1.png'>\
        //                     <p>当前抢修任务："+res.data.taskNum+"个</p>\
        //                     <p>抢修队伍："+res.data.teamNum+"支</p>\
        //                     <p>抢修人数："+res.data.repairNum+"人</p>\
        //                     </div>").appendTo(".fight-list2");
        //                 }
        //             },
        //             error: function(){
        //                 alert('请求错误')
        //             }
        //         });
        //         $.ajax({
        //             url: basepath +"/fault/countByAttribute",
        //             type: 'post',
        //             contentType: 'application/json',
        //             data: JSON.stringify({attribute:2}),
        //             dataType:'json',
        //             success: function(res){
        //                 if (res.code==200) {
        //                     //渲染列表
        //                     $("<div class='list_item'>\
        //                     <img src='./static/img/fight_tip2.png'>\
        //                     <p>当前抢修任务："+res.data.taskNum+"个</p>\
        //                     <p>抢修队伍："+res.data.teamNum+"支</p>\
        //                     <p>抢修人数："+res.data.repairNum+"人</p>\
        //                     </div>").appendTo(".fight-list2");
        //                 }
        //             },
        //             error: function(){
        //                 alert('请求错误')
        //             }
        //         });
        //         $.ajax({
        //             url: basepath +"/fault/countByAttribute",
        //             type: 'post',
        //             contentType: 'application/json',
        //             data: JSON.stringify({attribute:3}),
        //             dataType:'json',
        //             success: function(res){
        //                 if (res.code==200) {
        //                     //渲染列表
        //                     $("<div class='list_item'>\
        //                     <img src='./static/img/fight_tip3.png'>\
        //                     <p>当前抢修任务："+res.data.taskNum+"个</p>\
        //                     <p>抢修队伍："+res.data.teamNum+"支</p>\
        //                     <p>抢修人数："+res.data.repairNum+"人</p>\
        //                     </div>").appendTo(".fight-list2");
        //                 }
        //             },
        //             error: function(){
        //                 alert('请求错误')
        //             }
        //         });
        //         $('.fight-list2').show(500);
        //         event.stopPropagation();
        //     }else {
        //         $('.fight-list2').hide();
        //     }
        // })

        //------------------------ 失电坐标图 ------------------
        var powerPoints = [];
        function toPower() {

            if (mapType != "power") {
                $('body').removeClass('loaded');
                close();
                mapType = "power";
                $(".power-exp").css("display", "block");
                // disable();
                // 失电用户列表
                $.ajax({
                    url: basepath + "/client/webBigBanner",
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == 200) {
                            powerPoints = res.data.map(function (key, value) {
                                return value = { points: new BMap.Point(key.lng, key.lat), type: key.circuitStatusStr };
                            });
                            var data = boundaryType == "city" ? citys : townships;
                            for (var i = 0; i < data.length; i++) {
                                var number = 0;
                                for (var k = 0; k < powerPoints.length; k++) {
                                    if (BMapLib.GeoUtils.isPointInPolygon(powerPoints[k].points, data[i]) && powerPoints[k].type == '失电') {
                                        number++;
                                    }
                                }
                                var middle = powerInfo.middle.split('-');
                                var base = powerInfo.base.split('-');
                                if (number >= powerInfo.advanced) {
                                    var fillColor = "#ff0000";
                                } else if (number >= middle[0] && number < middle[1]) {
                                    var fillColor = "#ffff00";
                                } else if (number <= base[1]) {
                                    var fillColor = "#42d0fe";
                                }
                                data[i].setFillColor(fillColor);
                            }
                        }
                    },
                    error: function (res) {
                        console.log('请求错误14')
                    },
                    complete: function () {
                        $('body').addClass('loaded');
                    }
                });
            } else {
                close();
                toActive();
            }
        }
        /**
         * WGS84转GCj02
         * 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换
         * @param lng
         * @param lat
         * @returns {*[]}
         */
        // function WGS84toBD09 (lng, lat) {
        //     const xPI = 3.14159265358979324 * 3000.0 / 180.0
        //     const PI = 3.1415926535897932384626
        //     const a = 6378245.0
        //     const ee = 0.00669342162296594323
        //     // WGS84转GCj02
        //     let dlat = this.transformlat(lng - 105.0, lat - 35.0)
        //     let dlng = this.transformlng(lng - 105.0, lat - 35.0)
        //     let radlat = lat / 180.0 * PI
        //     let magic = Math.sin(radlat)
        //     magic = 1 - ee * magic * magic
        //     let sqrtmagic = Math.sqrt(magic)
        //     dlat = (dlat * 180.0) / ((a * (1 - ee)) / (magic * sqrtmagic) * PI)
        //     dlng = (dlng * 180.0) / (a / sqrtmagic * Math.cos(radlat) * PI)
        //     let mglat = lat + dlat
        //     let mglng = lng + dlng
        //     // 火星坐标系 (GCJ-02) 与百度坐标系 (BD-09) 的转换
        //     let z = Math.sqrt(mglng * mglng + mglat * mglat) + 0.00002 * Math.sin(mglat * xPI)
        //     let theta = Math.atan2(mglat, mglng) + 0.000003 * Math.cos(mglng * xPI)
        //     let bdlng = z * Math.cos(theta) + 0.0065
        //     let bdlat = z * Math.sin(theta) + 0.006
        //     // return [bdlng, bdlat]
        //     return {lng: bdlng, lat: bdlat}
        // }
        // function transformlat (lng, lat) {
        //     const PI = 3.1415926535897932384626
        //     let ret = -100.0 + 2.0 * lng + 3.0 * lat + 0.2 * lat * lat + 0.1 * lng * lat + 0.2 * Math.sqrt(Math.abs(lng))
        //     ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
        //     ret += (20.0 * Math.sin(lat * PI) + 40.0 * Math.sin(lat / 3.0 * PI)) * 2.0 / 3.0
        //     ret += (160.0 * Math.sin(lat / 12.0 * PI) + 320 * Math.sin(lat * PI / 30.0)) * 2.0 / 3.0
        //     return ret
        // }
        // function transformlng (lng, lat) {
        //     const PI = 3.1415926535897932384626
        //     let ret = 300.0 + lng + 2.0 * lat + 0.1 * lng * lng + 0.1 * lng * lat + 0.1 * Math.sqrt(Math.abs(lng))
        //     ret += (20.0 * Math.sin(6.0 * lng * PI) + 20.0 * Math.sin(2.0 * lng * PI)) * 2.0 / 3.0
        //     ret += (20.0 * Math.sin(lng * PI) + 40.0 * Math.sin(lng / 3.0 * PI)) * 2.0 / 3.0
        //     ret += (150.0 * Math.sin(lng / 12.0 * PI) + 300.0 * Math.sin(lng / 30.0 * PI)) * 2.0 / 3.0
        //     return ret
        // }

        //--------------------- 变电内涝图 ------------------
        function toHeat() {
            if (mapType != "heat") {
                // close();
                // mapType='heat';
                // addHeLiu();
                // disable();
                $.ajax({
                    url: basepath + "/waterlogging/find/waterlogging",
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        // var myIcon = new BMap.Icon("./static/img/icon_heat1.png", new BMap.Size(24,24));//创建图标
                        // myIcon.setImageSize( new BMap.Size(24,24));

                        for (var i = 0; i < res.data.length; i++) {
                            if (res.data[i].kv == "35" && $('.active-exp ul').eq(1).children("li").eq(0).children("i").hasClass('onIcon')) {
                                // myIcon.setImageUrl('./static/img/icon_heat1.png');
                                var color = 'icon_blue';
                            } else if (res.data[i].kv == "110" && $('.active-exp ul').eq(1).children("li").eq(1).children("i").hasClass('onIcon')) {
                                // myIcon.setImageUrl('./static/img/icon_heat2.png');
                                var color = 'icon_yellow';
                            } else if (res.data[i].kv == "220" && $('.active-exp ul').eq(1).children("li").eq(2).children("i").hasClass('onIcon')) {
                                // myIcon.setImageUrl('./static/img/icon_heat3.png');
                                var color = 'icon_red';
                            } else {
                                continue;
                            }
                            // var marker = new BMap.Marker(new BMap.Point(res.data[i].longitude,res.data[i].latitude),{icon:myIcon}); //将点转化成标注点

                            var tmpLabel = new BMap.Label('<span class="icon iconfont ' + color + '">&#xe60a;</span>', { position: new BMap.Point(res.data[i].longitude, res.data[i].latitude), offset: new BMap.Size(-7, -7) });
                            // tmpLabel.key = 1;
                            // tmpLabel.name = 1;
                            // tmpLabel.count = 1;
                            tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                            tmpLabel.setZIndex(999);
                            tmpLabel.id = res.data[i].id;
                            // marker.setLabel(tmpLabel);  //将标注点添加到地图上
                            map.addOverlay(tmpLabel);  //将标注点添加到地图上
                            tmpLabel.dotType = res.data[i].kv;
                            heatDots.push(tmpLabel);
                            //弹窗
                            res.data[i].address = res.data[i].address ? res.data[i].address : '';
                            res.data[i].phone = res.data[i].phone || '';
                            res.data[i].is_notice = res.data[i].is_notice == 1 ? '是' : '否';
                            var sContent = "<div class='myPop'>" +
                                "<div class='myPopTitle'>" +
                                "<h6>" + res.data[i].name + "</h6>" +
                                "</div>" +
                                "<div class='myPopInfo'>" +

                                "<p><span>电压等级丨</span>" + res.data[i].kv + "kV</p>" +
                                "<p><span>地    址丨</span>" + res.data[i].address + "</p>" +
                                "</div>" +
                                "<div class='myPopInfo'>" +
                                "<p><span>容    量丨</span>" + res.data[i].mva + "MVA</p>" +
                                "</div>" +
                                "</div>";

                            addClickHandler(sContent, tmpLabel);

                        }
                    },
                    error: function () {
                        console.log('请求错误15')
                    }
                });

            } else {
                close();
                toActive();
            }
        }

        $(document).click(function (e) {

            popType = '';
            pageCurrent = 1;
            $(".wrong-wrapper").hide();
            $(".mySelect-list").hide();
            $(".select-time-list").hide();
            $(".repair-chart").hide();
            $(".fight-detail").hide();
            $(".task-detail").hide();
            $(".fight-btn3").hide();
            $(".DelongSoXq").hide();
            $(".fight-list").hide();
            // $(".fight-list2").hide();
            // $(".fight-list3").hide();
        })

        $(".wrong-wrapper,a,.main-tab-txt2,.repair-chart,.select-time,.mySelect,.fight-list,.fight-detail,.fight-btn3,.task-detail,#imgzoom_cover").click(function (event) {
            event.stopPropagation();
        });



        //-------------------地图弹窗------------------------
        function formatDate(d) {
            return (
                d.getFullYear() +
                "-" +
                ("00" + (d.getMonth() + 1)).slice(-2) +
                "-" +
                ("00" + d.getDate()).slice(-2) +
                " " +
                ("00" + d.getHours()).slice(-2) +
                ":" +
                ("00" + d.getMinutes()).slice(-2) +
                ":" +
                ("00" + d.getSeconds()).slice(-2)
            );
        }

        function popUp(data) {
            if (popType != data || data == 'mode') {
                if (data != 'mode') {
                    popType = data;
                    pageCurrent = 1;
                }
                $('body').removeClass('loaded');
                if (pageCurrent == 1) {
                    $(".wrong-table").html('<div class="wrong-title">\
                    <div class="wrong-title-item">名称</div>\
                    <div class="wrong-title-item">时间</div>\
                    <div class="wrong-title-item">描述</div>\
                    <div class="wrong-title-item">单位</div>\
                    <div class="wrong-title-item">分类</div>\
                    <div class="wrong-title-item">来源</div>\
                    <div class="wrong-title-item">状态</div>\
                </div>');
                }
                $.ajax({
                    url: basepath + "/repair/schedule/click?data=" + popType + "&pageCurrent=" + pageCurrent + "&pageSize=10&startTime=" + phoonTime.startTime + "&endTime=" + phoonTime.endTime,
                    type: 'post',
                    contentType: 'application/json',
                    // data: JSON.stringify({'data':popType,'pageCurrent':pageCurrent,'pageSize':10,'startTime':phoonTime.startTime,'endTime':phoonTime.endTime}),
                    dataType: 'json',
                    success: function (res) {
                        if (res.data) {
                            for (var i = res.data.length - 1; i >= 0; i--) {
                                $("<div class='wrong-item'><div class='wrong-item-cell'>" + res.data[i].linename + "</div><div class='wrong-item-cell'>" + formatDate(new Date(res.data[i].zjfssj)) + "</div><div class='wrong-item-cell'>" + res.data[i].gzms + "</div><div class='wrong-item-cell'>" + res.data[i].ssdw + "</div><div class='wrong-item-cell'>" + res.data[i].gzlx + "</div><div class='wrong-item-cell'>" + res.data[i].gzly + "</div><div class='wrong-item-cell'>" + res.data[i].state + "</div></div>").appendTo(".wrong-table");
                            }
                            pageCurrent++;
                            $(".wrong-wrapper").show();
                            $('body').addClass('loaded');
                        } else {
                            pageCurrent == 1 ? $("<p class=\"wrong-icon\">暂无数据或信息不开放</p>").appendTo(".wrong-table") : null;
                            $(".wrong-wrapper").show();
                            $('body').addClass('loaded');
                        }
                    },
                    error: function (e) {

                    }
                });
            } else {
                popType = '';
                pageCurrent = 1;
                $(".wrong-wrapper").show();
            };
        }

        $('.wrong-container').scroll(function () {
            if ($(this)[0].scrollHeight <= $(this)[0].clientHeight + $(this)[0].scrollTop && $('body').hasClass('loaded')) {
                !isNaN(popType) ? getUserClick('mode') : popUp('mode');
            }
        })

        //---------select-------
        $(".mySelect-list").on("click", ".aside-user-item", function () {
            $(".mySelect p").html($(this).find(".aside-user-txt2:eq(0)").html());
            // $(".mySelect-list").hide();

            //close();
            isRun = false;
            mapType = "typhoon";
            var id = $(this).find(".aside-user-txt2").attr('id');
            typhoonId = $(this).find(".aside-user-txt2").attr('id');
            getTF(id);
            getDamagedMainNew(id);
            getDamagedBranchNew(id);
            getTripMainNew(id);
            getTripBranchNew(id);
            //HistoryTyphoonRightButton(id);
        })

        $(".mySelect p").click(function () {
            $(".select-time-list").hide();
            $(".mySelect-list").toggle();
        })

        $(".select-time-list").on("click", ".aside-user-item", function () {
            var year = $(this).text();
            $(".select-time p").text(year);
            $(".mySelect p").text('请选择');
            $(".select-time-list").hide();
            var isNum = /^[0-9]+$/.test(year);
            // mapType="";
            // close();
            // mapType="typhoon";
            if (isNum) {
                getTyphoonByYear(year);
            }
        })

        $(".select-time p").click(function () {
            // $(".mySelect-list").hide();
            $(".select-time-list").toggle();
        })
        //失电用户
        new Vue({
            el: ".importantUser",
            data: {
                list: [

                ]
            },
            mounted: function () {
                this.setList();
            },
            methods: {
                changecheckbox(val, index, id) {
                    /*  console.log(val, index,id)
                     console.log(powerDots); */
                    ajax(`/api/client/isTempCircuit?id=${id}&is_temp_circuit=${val ? 1 : 0}`).then(res => {
                        console.log(res);
                        if (val) {
                            $('.importantflash').eq(index).addClass('dtdt backOrange')
                        } else {
                            $('.importantflash').eq(index).removeClass('dtdt backOrange')
                        }
                    })
                },
                clickList(e) {
                    for (let x = 0; x < powerDots.length; x++) {
                        $('.rightImportant').eq(x).removeClass('green ');
                    }
                    powerDots[e].setZIndex(9999);
                    $('.rightImportant').eq(e).addClass('green ');
                },
                setList() {
                    ajax('/client/webBigBanner', 'post', {}).then(res => {
                        if (res.code == 200) {
                            powerPoints = res.data.map(function (key, value) {
                                return value = { points: new BMap.Point(key.lng, key.lat), type: key.circuitStatusStr };
                            });

                            //循环建立标注点
                            for (var i = 0; i < powerPoints.length; i++) {
                                let backColor = res.data[i].circuitStatusStr == '正常' ? 'Transparent' : (res.data[i].isTempCircuit ? 'backOrange' : '');
                                if (powerPoints[i].type == '正常') {
                                    var color = 'icon_blue';
                                } else if (powerPoints[i].type == '失电') {
                                    var color = 'icon_red';
                                } else {
                                    var color = 'icon_yellow';
                                }
                                var tmpLabel = new BMap.Label('<span class="rightImportant icon iconfont ' + color + '">&#xe60d;</span>', { position: powerPoints[i].points, offset: new BMap.Size(-7, -7) });
                                tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                                tmpLabel.setZIndex(999);
                                map.addOverlay(tmpLabel);  //将标注点添加到地图上
                                tmpLabel.id = res.data[i].id
                                powerDots.push(tmpLabel);
                                var tmpLabel2 = new BMap.Label(`<span class="dtdtbox"><span class="${res.data[i].isTempCircuit ? 'dtdt' : ''} importantflash ${backColor}"></span></span>`, { position: new BMap.Point(powerDots[i].point.lng, powerDots[i].point.lat), offset: new BMap.Size(-25, -25) });
                                tmpLabel2.setStyle({
                                    backgroundColor: 'rgba(255, 255, 255, 0)',
                                    border: "none",
                                })
                                map.addOverlay(tmpLabel2);
                                var sContent = "<div class='powerPop'><div class='powerPop-title'>" + res.data[i].clientName + "</div></div>";
                                addClickHandler(sContent, tmpLabel, 'power');
                            }
                            this.list = res.data;
                        }

                    })
                }
            }
        })
        new Vue({//支援情况报表
            el: ".countiesBox",
            data: {
                navList: [
                    {
                        title: "支援名单"
                    },
                    {
                        title: "支援人数"
                    },
                    {
                        title: "被支援单位"
                    },
                    {
                        title: "车辆数"
                    }
                ],
                list: [],
            },
            mounted: function () {
                this.Counties(0);
            },
            methods: {
                Counties(e) {
                    var that = this;
                    if (e == 0) {
                        e = 3
                    } else if (e == 1) {
                        e = 1
                    }
                    ajax('/support/report', 'get', { type: e }).then(res => {
                        that.list = res.data;
                    })
                },
            }
        });
        //控制以下vue对象变量
        var xian;// 变电线路
        var importantP;//重要用户
        var substationP;//变电站
        var baiduAddress;//百度地图搜索标注的点
        new Vue({//地图搜索
            el: ".dpvue",
            data: {
                list: [],
                searchInput: null,
                LWstatus: {
                    status: false,
                    text: "路线显示"
                },
                warningLevel: null,
                hydrology: {
                    navTitle: [
                        {
                            title: '河网水库'
                        },
                        {
                            title: '库容'
                        },
                        {
                            title: '实时水位'
                        },
                        {
                            title: '警戒水位'
                        }
                    ],
                    list: [
                        {
                            title: '河网水库'
                        },
                        {
                            title: '实时水位'
                        },
                        {
                            title: '状态'
                        },
                        {
                            title: '区域'
                        }
                    ]
                },
                searchSwitch: true,
                textEventList: [],//小广告List
                importantInfo: {//1415254329
                    importantInfoList: [],
                    status: false,
                },
                taskInfo: {
                    taskList: [],
                    taskStatus: false
                },
                statisticsInfo: {
                    statisticsInfoList: []
                }
            },
            mounted: function () {
                this.MyFun();
            },
            methods: {
                BaiduSearch: function () {
                    $('.qhinput').eq(1).hide();
                    function G(id) {
                        return document.getElementById(id);
                    }
                    var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
                        {
                            "input": "suggestId"
                            , "location": map
                        });
                    ac.addEventListener("onhighlight", function (e) {  //鼠标放在下拉列表上的事件
                        var str = "";
                        var _value = e.fromitem.value;
                        var value = "";
                        if (e.fromitem.index > -1) {
                            value = _value.province + _value.city + _value.district + _value.street + _value.business;
                        }
                        str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;
                        value = "";
                        if (e.toitem.index > -1) {
                            _value = e.toitem.value;
                            value = _value.province + _value.city + _value.district + _value.street + _value.business;
                        }
                        str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
                        G("searchResultPanel").innerHTML = str;
                    });
                    var myValue;
                    ac.addEventListener("onconfirm", function (e) {    //鼠标点击下拉列表后的事件
                        console.log(e);
                        var _value = e.item.value;
                        myValue = _value.province + _value.city + _value.district + _value.street + _value.business;
                        G("searchResultPanel").innerHTML = "onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
                        setPlace();
                    });
                    function setPlace() {
                        function myFun() {
                            map.removeOverlay(baiduAddress);
                            var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
                            baiduAddress = new BMap.Label('<p class="iconfont iconAddress searchAddress"></p>', { position: new BMap.Point(pp.lng, pp.lat), offset: new BMap.Size(-10, -20) });
                            baiduAddress.setZIndex(1003);
                            map.addOverlay(baiduAddress);
                            console.log(pp);
                            $('.searchAddress').parent('.BMapLabel').css({
                                'background': "none",
                                'border': "none"
                            })
                        }
                        var local = new BMap.LocalSearch(map, { //智能搜索
                            onSearchComplete: myFun
                        });
                        local.search(myValue);
                    }
                },
                SearchSwitch: function () {//搜索框切换
                    this.searchSwitch = !this.searchSwitch;
                    if (this.searchSwitch) {
                        $('.qhinput').eq(1).hide();
                        $('.qhinput').eq(0).show();
                    } else {
                        $('.qhinput').eq(0).hide();
                        $('.qhinput').eq(1).show();
                    }
                    this.list = [];
                    this.searchInput = null;
                },
                Hydrology: function () {//水文情况
                    $.ajax({
                        url: basepath + "waterwave/info",
                        type: 'get',
                        success: res => {
                            this.hydrology.list = res.data;
                        },
                    })
                },
                SearchClick: function (e) {  //点击List高亮
                    console.log(e);
                    console.log(this.list[e]);
                    //console.log(ganLines);//线路 type7
                    //console.log(powerDots);//重要用户
                    if (this.list[e].type == 1) {//重要客户 type1
                        for (let i = 0; i < powerDots.length; i++) {
                            if (powerDots[i].id == this.list[e].id) {
                                if (importantP) {
                                    map.removeOverlay(importantP);
                                }
                                importantP = new BMap.Label('<span class="rightImportant iconfont icon ft18">&#xe60d;</span>', { position: powerPoints[i].points, offset: new BMap.Size(-7, -7) });
                                importantP.setStyle({ border: 0, background: '', padding: 0, color: 'red' });
                                importantP.setZIndex(1000);
                                map.addOverlay(importantP);
                                break;
                            }
                        }
                    } else if (this.list[e].type == 5) {//变电站 type1
                        for (let i = 0; i < heatDots.length; i++) {
                            console.log(heatDots[i].id, this.list[e].id)
                            if (heatDots[i].id == this.list[e].id) {
                                if (importantP) {
                                    map.removeOverlay(importantP);
                                }
                                importantP = new BMap.Label('<span class="rightImportant iconfont icon ft18">&#xe60a;</span>', { position: heatDots[i].point, offset: new BMap.Size(-7, -7) });
                                importantP.setStyle({ border: 0, background: '', padding: 0, color: 'red' });
                                importantP.setZIndex(1000);
                                map.addOverlay(importantP);
                                break;
                            }
                        }
                    } else if (this.list[e].type == 7) {//变电线路 type7
                        var xianLuList = [];
                        if (xian) {
                            map.removeOverlay(xian);
                        }

                        for (let i = 0; i < ganLines.length; i++) {
                            if (ganLines[i].ganId == this.list[e].id) {
                                for (let y = 0; y < ganLines[i].latLng.length; y++) {
                                    xianLuList.push(new BMap.Point(ganLines[i].latLng[y].lng, ganLines[i].latLng[y].lat));
                                }
                                xian = new BMap.Polyline(xianLuList, {
                                    strokeColor: "red",
                                    strokeWeight: 5,
                                    strokeOpacity: 0.9
                                })
                                map.addOverlay(xian);
                                break;
                            }
                        }
                    }
                },
                SearchInput: function (e) {//根据数据框内容接口
                    var that = this;
                    setTimeout(function () {
                        if (that.searchInput) {
                            let data = {
                                name: that.searchInput
                            }
                            ajax('/map/search', 'get', data).then(res => {
                                if (res.code == 200) {
                                    if (res.data.length != 0) {
                                        that.list = res.data;
                                    }
                                }
                            })
                        } else {
                            that.list = []
                        }
                    }, 500)
                },
                WarningLevel() {//市防指响应等级
                    var that = this;
                    ajax('warning/info').then(res => {
                        that.warningLevel = res.data;
                    })
                },
                LW(e) {
                    if (!this.LWstatus.status) {
                        map.setMapType(BMAP_HYBRID_MAP);
                        this.LWstatus.status = true,
                            this.LWstatus.text = '路网隐藏'
                    } else {
                        map.setMapType(BMAP_SATELLITE_MAP);
                        this.LWstatus.status = false,
                            this.LWstatus.text = '路网显示'
                    }
                    event.stopPropagation();
                },
                TextEvent() {//小广告
                    let that = this;
                    ajax('timeline/info').then(res => {
                        that.textEventList = res.data;
                    })
                },
                getImportantInfo() {//获取重要信息//1415254329
                    ajax('/important/point', 'get').then(res => {
                        if (res.code == 200) {
                            for (let i = 0; i < res.data.length; i++) {
                                if (!res.data[i].longitude && !res.data[i].latitude) {
                                    return;
                                }
                                if (res.data[i].color == 0) {
                                    var color = 'icon_red'
                                } else if (res.data[i].color == 1) {
                                    var color = 'icon_yellow'
                                } else if (res.data[i].color == 2) {
                                    var color = 'icon_blue'
                                } else {
                                    var color = 'icon_blue'
                                }
                                var tmpLabel = new BMap.Label('<p class="icon iconfont ' + color + ' min_font"></p>', { position: new BMap.Point(res.data[i].longitude, res.data[i].latitude), offset: new BMap.Size(-1.5, -1.5) });
                                tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                                tmpLabel.setZIndex(1000);
                                tmpLabel.maxContent = '<p class="icon iconfont ' + color + '">&#xe810;</p>';
                                tmpLabel.minContent = '<p class="icon iconfont ' + color + ' min_font"></p>';
                                tmpLabel.status = res.data[i].isDisplay == 1 ? true : false;
                                map.addOverlay(tmpLabel);
                                fightDotsOpen = false;
                                importantTextDots.push(tmpLabel);
                                var sContent =
                                    "<div class='powerPopInformation'>" +
                                    "<div class='powerPopInformationDiv1 bold'>" + res.data[i].content + "<div>" +
                                    "<div>" + "时间：" + res.data[i].time + "<div>" +
                                    "</div>"
                                    ;//文本
                                addClickHandler(sContent, tmpLabel);
                                if (res.data[i].isDisplay == 0) {
                                    res.data[i].status = false;
                                    importantTextDots[i].hide();

                                } else {
                                    res.data[i].status = true;
                                }

                            }
                            this.importantInfo.importantInfoList = res.data;
                        }
                    })

                },
                setRoll(e, index, id){
                    /* console.log(e,index,id); */
                    ajax(`/api/important/operation?id=${id}&is_roll=${e?1:0}`).then(res=>{
                        this.TextEvent();
                        console.log(res);
                    })
                },
                setImportantInfoCheckbox(e, index, id) {//重要信息Checkbox
                    var data = {
                        id: id,
                        is_display: this.importantInfo.importantInfoList[index].status ? 1 : 0
                    }
                    if (e) {
                        ajax('important/operation', 'get', data).then(res => {
                            this.importantInfo.importantInfoList[index].status = true;
                            importantTextDots[index].show();
                            importantTextDots[index].status = true
                        })

                    } else {
                        ajax('important/operation', 'get', data).then(res => {
                            this.importantInfo.importantInfoList[index].status = false
                            importantTextDots[index].hide();
                            importantTextDots[index].status = false
                        })

                    }
                },
                setIconAlarm() {//Icon点击事件
                    this.importantInfo.status = !this.importantInfo.status;
                },
                getTaskList() {//Icon点击事件
                    this.taskInfo.taskStatus = !this.taskInfo.taskStatus
                },
                getTaskListInfo() {//任务列表 Icon点击事件而来
                    ajax('/fault/task', 'post').then(res => {
                        if (res.code == 200) {
                            this.taskInfo.taskList = res.data;
                            res.data.forEach(item => {
                                var tmpLabel = new BMap.Label('<p class="icon iconfont icon_yellow min_font"></p>', { position: new BMap.Point(item.lng, item.lat), offset: new BMap.Size(-1.5, -1.5) });
                                tmpLabel.setStyle({ border: 0, background: '', padding: 0 });
                                tmpLabel.setZIndex(999);
                                map.addOverlay(tmpLabel);  //将标注点添加到地图上
                                tmpLabel.maxContent = '<p class="icon iconfont icon_yellow epairDotDom">&#xe60c;</p>';
                                tmpLabel.minContent = '<p class="icon iconfont icon_yellow min_font epairDotDom"></p>';
                                fightDotsOpen = false;
                                repairTaskDots.push(tmpLabel);
                                addClickHandler(item, tmpLabel, 'task');
                            })
                        }
                    })
                },
                getDelongSo: function (e, event) {
                    console.log(e, event)
                    $('.epairDot').removeClass('epairDot');
                    $('.epairDotDom').eq(e).addClass('epairDot');
                    $(".DelongSoXq").show();
                    taskDetail(this.taskInfo.taskList[e], 2);
                    event.stopPropagation();
                    /*  $('.epairDot').removeClass('epairDot');
                     $('.epairDotDom').eq(e).addClass('epairDot');
                     this.eq = e;
                     //$(".DelongSoXq").show();
                     taskDetail(this.list[e], 2);
                     event.stopPropagation(); */
                },
                getStatisticsInfo() {//统计信息
                    ajax('statistics/list', 'get').then(res => {
                        this.statisticsInfo.statisticsInfoList = res.data
                    })
                },
                MyFun() {
                    this.getStatisticsInfo();//统计信息
                    this.WarningLevel();//市防指响应等级
                    this.Hydrology();//水文情况
                    this.BaiduSearch();//百度地图搜索
                    this.TextEvent();//小广告
                    this.getImportantInfo();//重要信息列表
                    this.getTaskListInfo();//抢修任务列表
                    document.addEventListener('click', (e) => {
                        console.log(e);
                        if (!this.$el.contains(e.target)) {
                            this.searchInput = null;
                            this.list = [];
                            this.taskInfo.taskStatus = false
                        }
                    })
                },
            }
        });
        new Vue({//打开右侧Tab
            el: ".tab92",
            data: {
                tabAction: 0,
                tablist: [
                    {
                        title: "受损情况总览",
                        index: 0,
                    },
                    {
                        title: "变电所明细",
                        index: 1,
                    }
                ],
                list: [],

            },
            mounted: function () {
                this.List();
                HistoryTyphoonRightButton();
            },
            methods: {
                Tablist(e) {
                    this.tabAction = e;
                    if (!e) {
                        HistoryTyphoonRightButton();
                    }
                },
                List() {
                    var that = this;
                    ajax(`history/damagedStation/${typhoonId}`).then(res => {
                        that.list = res.data;
                    })
                },
            }
        });
        new Vue({//IM
            el: ".xvuebox",
            data: {
                url: null,
                status: false,
                classYouId: null,
                imList: [],
                imObj: null,
                loading: false,
                youName: null,
            },
            mounted: function () {
                $('.imbox').hide();
                this.Setin();//轮询消息
                document.addEventListener('click', (e) => {
                    if (!e.target.dataset.icon) {
                        //$('.imbox').hide();
                    }
                });
                window.ImClick = this.Click;
            },
            methods: {
                ImListClick(index) {//点击好友列表
                    this.classYouId = this.imList[index].youId;
                    console.log(this.imList)
                    this.url = impath + '?yunxinAccid=' + this.imList[index].myId + '&yunxinToken=' + this.imList[index].myToken + '&youAccid=' + this.imList[index].youId + '&name=' + this.imList[index].name;
                },
                ImIcon() {
                    if (this.imList.length != 0) {
                        if ($(".imbox").is(":hidden")) {
                            $('.imbox').show();
                        } else {
                            $('.imbox').hide();
                        }
                    }
                },
                Cross() {
                    $('.imbox').hide();
                },
                Setin() {
                    var that = this;
                    setInterval(function () {//消息推送定时器
                        ajax('/user/receivePush').then(res => {
                            if (res.data.length) {
                                var chat = confirm(res.data[0].content);
                                if (chat) {
                                    that.url = impath + '?yunxinAccid=' + res.data[0].receiveYunxinAccid + '&yunxinToken=' + res.data[0].receiveYunxinToken + '&youAccid=' + res.data[0].sendYunxinAccid + '&name=' + res.data[0].name;
                                    $('.imbox').show();
                                    that.obj = {
                                        myId: res.data[0].receiveYunxinAccid,
                                        myToken: res.data[0].receiveYunxinToken,
                                        youId: res.data[0].sendYunxinAccid
                                    }
                                    this.classYouId = res.data[0].sendYunxinAccid;
                                    that.ImListPush();
                                }
                            }
                        })
                    }, 10000)
                },
                Click(MyId, MyToken, YouId, name) {
                    this.url = impath + '?yunxinAccid=' + MyId + '&yunxinToken=' + MyToken + '&youAccid=' + YouId + '&name=' + name;
                    $('.imbox').show();
                    this.obj = {
                        myId: MyId,
                        myToken: MyToken,
                        youId: YouId,
                        name: name
                    }
                    this.classYouId = YouId;
                    this.ImListPush();
                },

                ImListPush() {
                    this.imList.unshift(this.obj);
                    for (let i = 0; i < this.imList.length; i++) {
                        if (this.imList[i].youId == this.obj.youId) {
                            if (i) {
                                this.imList.splice(i, 1);
                            }
                        }
                    }
                }
            }
        });
        //历史台风初始化
        $(document).keyup(function (e) {
            var key = e.which;
            if (key == 13) {//当用户按下回车键时
            }
        });
        $(".DelongSoXq").click(function () {
            event.stopPropagation();
        })
        $('.DelongSoXq').drag(20);
    </script>
</body>

</html>